如何使用jQuery Mobile在頁面加載之前加載對話框或彈出窗口
[英]How to load Dialog or Popup before page load using jquery mobile
問題描述
在使用jquery Mobile加載頁面之前，是否有任何方法可以調用/顯示Dialog或彈出窗口？
我想在頁面加載之前得到一些輸入，根據輸入，下一頁將被加載
3 個解決方案
解決方案1
2 2013-05-08 12:55:26
要在顯示頁面之前加載對話框或彈出窗口，需要使用seTimeout 。 如果您立即調用它，它將立即打開和關閉。
$(document).on('pagebeforeshow', '#pageID', function() {
setTimeout(function () {
$('#popupID').popup('open');
}, 100); // delay above zero
});
解決方案2
1 2013-05-08 20:52:16
您的問題有一個非常簡單的解決方案，只需將首頁設為對話框即可。
工作示例： http : //jsfiddle.net/Gajotres/dj3UP/1/
正如您在我的示例中看到的那樣，這是一個純HTML解決方案。 第一頁數據角色屬性已更改為dialog 。
HTML：
<!DOCTYPE html>
<html>
<head>
<title>jQM Complex Demo</title>
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; minimum-scale=1.0; user-scalable=no; target-densityDpi=device-dpi"/>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
</head>
<body>
<div data-role="dialog" id="index">
<div data-theme="a" data-role="header">
<h3>
First Page
</h3>
</div>
<div data-role="content">
<input type="text" value="" id="some-input"/>
<a data-role="button" id="some-button" href="#second">Next page</a>
</div>
<div data-theme="a" data-role="footer" data-position="fixed">
</div>
</div>
<div data-role="page" id="second">
<div data-theme="a" data-role="header">
<h3>
Second Page
</h3>
<a href="#index" class="ui-btn-left">Back</a>
</div>
<div data-role="content">
</div>
<div data-theme="a" data-role="footer" data-position="fixed">
</div>
</div>
</body>
</html>
解決方案3
0 2013-05-08 12:49:12
嘗試以下操作：
$.mobile.loading( 'show', {
text: 'foo',
textVisible: true,
theme: 'z',
html: ""
});
推薦鏈接：
jQuery Mobile對話框在頁面加載時，對話框不加載
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.