如何在按钮onClick上用jQuery移动显示底部条？

Question

我正在开发一个使用jQuery手机的移动应用程序。我创建了一个和Gmail一样的写作邮件。在“取消”按钮单击，我需要一个底部栏显示与选项，如保存，保存为草案，并放弃。

我试过的是：

<div data-role="header" data-position="fixed" data-theme="b">
    <button class="ui-btn ui-btn-inline" data-mini="true">Send</button>
    <h1>Compose</h1>
    <button class="ui-btn ui-btn-inline" data-mini="true">Cancel</button>
</div>
<div>
    <input name="To" id="To" value="" type="text" data-mini="true" placeholder="To" />
</div>
<div>
    <input name="Subject" id="Subject" value="" type="text" data-mini="true" placeholder="Subject" />
</div>
<div>
    <textarea cols="40" rows="22"  name="textarea-2" id="textarea-2" placeholder="Compose Mail "></textarea>
</div>

Answer 1

添加隐藏页脚：

<div id="footer" data-role="footer" data-position="fixed" data-theme="b" hidden="">
    <button class="ui-btn ui-btn-inline" data-mini="true">Save</button>
    <button class="ui-btn ui-btn-inline" data-mini="true">Save as</button>
    <button class="ui-btn ui-btn-inline" data-mini="true">Discard</button>
</div>

并在需要时展示出来：

$("#footer").show();