我正在尝试使用 jQuery Mobile 显示一个对话框。代码如下
if(condition){
setTimeout(function(){
$.mobile.changePage('#myDiv',{transition:'pop', role: 'dialog'});
},100);
}
我还有以下代码来动态生成该对话框的内容
$('#myDiv').on('pageshow', function(){
// do custom operation
});
它在 Fireforx 和 IE 中运行良好。但在 chrome 和 safari 中,该对话框出现然后在几秒钟内消失。
我已经为此绞尽脑汁一天了。非常感谢任何帮助。
提前致谢
编辑:我认为如果我陈述 DOM 结构会很棒。所以我来了...
<html>
<head>...</head>
<body>
<div data-role="page" id="startPage">
...
<script>
$('#startPage').on('pageinit', function(){
// Do some stuff
if(condition){
setTimeout(function(){
$.mobile.changePage('#myDiv', {transition: 'pop', role: 'dialog'});
}, 100);
}
});
</script>
</div>
<div data-role="dialog" id="myDiv">
...
<script>
$('#myDiv').on('pageshow', function(){
// do custom operation
});
</script>
</div>
</body>
</html>
最佳答案
尝试将所有脚本拉到页面 DIV 之外,并将其放在结束正文标记之前。这是fiddle 。这在 Chrome 和 Safari 中适用于我。
<div data-role="page" id="startPage">
<div data-role="header"><h1>Page</h1></div>
</div>
<div data-role="dialog" id="myDiv">
<div data-role="header"><h1>Dialog</h1></div>
<div data-role="content">
<span id="dynamicContent"></span>
</div>
</div>
<script>
var condition = true;
$('#startPage').on('pageinit', function(){
if(condition){
setTimeout(function(){
$.mobile.changePage('#myDiv', {transition: 'pop', role: 'dialog'});
}, 100);
}
});
$('#myDiv').on('pageshow', function(){
$('#dynamicContent').html('Here is some dynamic content!');
});
</script>
关于javascript - $.mobile.changePage 在 Chrome 和 Safari 中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18998835/