如何在jquery mobile中打开外部html页面作为弹出窗口？ [英] How to open an external html page as a popup in jquery mobile?
问题描述
我有这样的链接
<a href='/path/to/popup.html' data-role="button">COME HERE </a>
我想打开 popup.html文件作为jquery弹出窗口。而且我无法在当前页面中将其作为带有ID的< div> 。我必须将它放在当前文件旁边。
I want to open the popup.html file as a jquery popup. And I cant have it inside the current page as a <div> with an id. I must have it out side the current file.
和我无法使用对话框重新加载当前页面。关于如何做的任何想法？
And I cant use dialog's as it reloads the current page. Any idea on how to do it?
在 popup.html中我只使用一个标题。
Or any methods through which I can avoid the page being reloaded when dialog is closed?
推荐答案
使用 .load（） 将 popup.html 加载到占位符（即< div id =PopupPH> ）。这个占位符可以放在 data-role =page 里面，也可以放在它之外，具体取决于您使用的jQuery Mobile版本。
Use .load() to load popup.html into a placeholder (i.e <div id="PopupPH">). This placeholder can be placed either inside data-role="page or outside it, depending on jQuery Mobile version you are using.
此外，在 popup.html 中，您需要将 data-role = page更改为数据 - role =popup ，以便将其视为弹出而不是页。
Moreover, in popup.html, you need to change data-role=page" to data-role="popup in order to treat it as a popup not a page.
在正文标记内插入占位符或 data-role =页面并加载 popup.html 。
Insert placeholder inside body tag or data-role="page" and load popup.html.
<body>
<div data-role="page">
</div>
<div id="PopupPH">
<!-- placeholder for popup -->
</div>
</body>
或
<body>
<div data-role="page">
<div id="PopupPH">
<!-- placeholder for popup -->
</div>
</div>
</body>
将 popup.html 加载到占位符
$("#PopupPH").load("popup.html");
在 popup.html 弹出式div中，添加JS以创建，打开和一旦关闭就移除弹出窗口。
Inside popup.html popup div, add JS to create, open and remove popup once it's closed.
<div data-role="popup">
<!-- contents -->
<script>
$("[data-role=popup]").enhanceWithin().popup({
afterclose: function () {
$(this).remove();
}
}).popup("open");
</script>
</div>
jQuery Mobile 1.3及以下
与上面相同，除了弹出占位符应该在 data-role =page内，因为jQM 1.3不支持外部弹出窗口。另外，将 .enhanceWithin（）替换为 .trigger（create）。
jQuery Mobile 1.3 and below
Do the same as above, except for popup placeholder should be inside data-role="page", because jQM 1.3 doesn't support external popup. Also, replace .enhanceWithin() with .trigger("create").
这篇关于如何在jquery mobile中打开外部html页面作为弹出窗口？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
