jQuery Mobile 弹窗

弹窗是一个非常流行的对话框,弹窗可以覆盖在页面上展示。

弹窗可用于显示一段文本,图片,地图或其他内容。

创建一个弹窗,需要使用 <a> 和 <div> 元素。在 <a> 元素上添加 data-rel="popup" 属性, <div> 元素添加 data-role="popup" 属性。 接着我们为 <div> 指定 id, 然后设置 <a> 的 href 值为 <div> 指定的 id。 <div> 中的内容为弹窗显示的内容。

注意: <div> 弹窗与点击的 <a> 链接必须在同一个页面上。

实例

<a href="#myPopup" data-rel="popup" class="ui-btn ui-btn-inline ui-corner-all">显示弹窗</a>

<div data-role="popup" id="myPopup">
  <p>这是一个简单的弹窗</p>
</div>

注意: 在接下来的章节中,你将了解到如何在弹窗中使用表单。