Javascript 无法使用jQuery Mobile 1.3.1显示弹出窗口
我试图在jQuery Mobile中弹出一个非常简单的“确定吗?”弹出窗口。但是如果我使用按钮上的Javascript 无法使用jQuery Mobile 1.3.1显示弹出窗口,javascript,html,jquery-mobile,mobile,popup,Javascript,Html,Jquery Mobile,Mobile,Popup,我试图在jQuery Mobile中弹出一个非常简单的“确定吗?”弹出窗口。但是如果我使用按钮上的data rel=“popup”,什么也不会发生。如果我删除数据rel,它会打开,但会作为一个完整窗口。逻辑运行良好,但我仍然希望看到一个弹出窗口 下面是代码(简化-我删除了其他页面、标题、html等-除此之外,该应用程序运行良好,因此无需调试)。要查看的两个元素是按钮“clearHistory”和弹出窗口本身“history”: 历史 历史是空的 删除历史记录? 是否删除历史记录中的所有项目?
data rel=“popup”
,什么也不会发生。如果我删除数据rel
,它会打开,但会作为一个完整窗口。逻辑运行良好,但我仍然希望看到一个弹出窗口
下面是代码(简化-我删除了其他页面、标题、html等-除此之外,该应用程序运行良好,因此无需调试)。要查看的两个元素是按钮“clearHistory”和弹出窗口本身“history”:
历史
历史是空的
删除历史记录?
是否删除历史记录中的所有项目?
知道我在这里遗漏了什么吗?将popup放在
中,该div应该是popup div的直接父级。在下面的演示中,我将其放在
之前
对话框应该放在
外部,因为它们被视为一个页面。将弹出窗口放在
内部,该div应该是弹出窗口div的直接父级。在下面的演示中,我将其放在
之前
对话框应该放在
之外,因为它们被视为一个页面。@TravelingTechGuy de nada:)@TravelingTechGuy de nada:)
<!-- history page -->
<div data-role="page" id="history">
<div data-role="header" data-position="fixed">
<a href="#" data-role="button" data-rel="back" data-icon="arrow-l" data-iconpos="notext">Back</a>
<h1>History</h1>
<a href="#deletePopup" data-role="button" data-rel="popup" id="clearHistory" data-icon="delete" data-iconpos="notext" data-theme="d">Delete</a>
</div><!-- /header -->
<div data-role="content">
<ul data-role="listview" id="historyList" data-inset="true" data-theme="f"></ul>
<h4 id="historyEmpty">History is empty</h4>
</div><!-- /content -->
<div data-role="footer" data-position="fixed">
<h4><a class="ttg" href="http://www.TravelingTechGuy.com" rel="external" target="_blank">Traveling Tech Guy</a></h4>
</div><!-- /footer -->
</div>
<!-- end history page -->
<!-- delete history popup -->
<div data-role="popup" id="deletePopup" data-overlay-theme="a" data-theme="c" data-dismissible="false">
<div data-role="header" data-theme="a">
<h1>Delete History?</h1>
</div>
<div data-role="content" data-theme="d">
<h3>Delete all items in history?</h3>
<a href="#" data-role="button" data-inline="true" data-rel="back" data-theme="b">Cancel</a>
<a href="#" data-role="button" data-inline="true" data-rel="back" data-theme="d" id="deleteHistory">Delete</a>
</div>
</div>
<!-- delete history popup -->