Android Jquery mobile:如何仅在首次加载页面时显示弹出窗口?
我开始使用jquery mobile开发我的第一个移动应用程序。 到目前为止,它一直进展顺利,但我无法解决一个特定的弹出行为 当用户加载应用程序时,我希望弹出窗口显示的内容。这个弹出窗口应该类似于你在许多应用程序中看到的“添加到主页”弹出窗口。它旨在通过一些重要的按钮将用户的方向指向固定的页脚。我设法插入这个弹出窗口并在页面加载时打开它,但有两件事我不能做Android Jquery mobile:如何仅在首次加载页面时显示弹出窗口?,android,ios,jquery-mobile,mobile,popup,Android,Ios,Jquery Mobile,Mobile,Popup,我开始使用jquery mobile开发我的第一个移动应用程序。 到目前为止,它一直进展顺利,但我无法解决一个特定的弹出行为 当用户加载应用程序时,我希望弹出窗口显示的内容。这个弹出窗口应该类似于你在许多应用程序中看到的“添加到主页”弹出窗口。它旨在通过一些重要的按钮将用户的方向指向固定的页脚。我设法插入这个弹出窗口并在页面加载时打开它,但有两件事我不能做 我的弹出窗口加载并消失,这是我想要的,这一切都是好的。但是,一旦重新加载页面,或导航到另一个页面并返回,它将再次打开。这对用户来说很烦人。我
<div data-role="page" id="home">
<div data-position="fixed" data-role="header" data-theme="d">
<h1>Prva pomoć</h1>
<button data-icon="info" data-iconpos="right"></button>
</div>
<div data-role="content">
<ul data-role="listview" data-divider-theme="d">
<li data-role="list-divider">Ne reagira i ne diše
</li>
<li><a href="#page2">Oživljavanje</a></li>
<li><a href="#page3">Oživljavanje + AVD</a></li>
<li data-role="list-divider">Ne reagira, ali diše</li>
<li><a href="#page4">Bočni položaj</a></li>
<li data-role="list-divider">Ostalo</li>
<li><a href="#page4">Gušenje</a></li></ul></div>
<div id="popspot"></div>
<div data-role="popup" id="popup" data-transition="slidedown" data-position-to="#popspot" data-theme="a" data-overlay-theme="e" data-history="true">
<p>U slučaju hitnoće koristi ovaj izbornik!<p></div>
<script type="text/javascript" language="JavaScript">
$(":jqmData(role='page'):last").on("pageshow", function(event) {
$("#popup", $(this)).popup("open");
setTimeout(function(){
$("#popup").popup("close");
}, 3000);
});
</script>
<div data-role="footer" id="hitnizbor" data-position="fixed" class="nav-glyphish-example">
<div class="nav-glyphish-example" data-grid="b" data-role="navbar" data-theme="e">
<ul>
<li><a href="#popup" data-rel="popup" id="chat" data-icon="custom">Zovi Hitnu</a></li>
<li><a href="#" id="email" data-icon="custom">Oživljavanje</a></li>
<li><a href="#" id="skull" data-icon="custom">Osobni podaci</a></li>
</ul>
</div>
普拉瓦·波莫奇
- Ne reagira i Ne diše
- Ne reagira,ali diše
- Ostalo
你是希特诺奇·科里斯蒂·奥瓦伊·伊兹博尼克
$(“:jqmData(role='page'):last”)。在(“pageshow”上,函数(事件){
$(“#popup”,$(this)).popup(“open”);
setTimeout(函数(){
$(“弹出”)。弹出(“关闭”);
}, 3000);
});
您可以使用会话存储或本地存储来跟踪与是否显示弹出窗口相关的信息 您的代码如下所示
if (localStorage.popUpShown != 'true') {
// window will position the pop up to center
$('#popup').popup('open', {positionTo: 'window'});
localStorage.popUpShown = 'true';
setTimeout(function () {
$("#popup").popup("close");
}, 3000);
}
else{
// Can remove this alert in development enviornment.
alert('already shown the popup');
}
您可以在此处查看
还对html进行了一些调整。您的html页面中有标记错误
<div data-role="page" id="home">
<div data-position="fixed" data-role="header" data-theme="d">
<h1>Prva pomoć</h1>
<button data-icon="info" data-iconpos="right"></button>
</div>
<div data-role="content">
<ul data-role="listview" data-divider-theme="d">
<li data-role="list-divider">Ne reagira i ne diše</li>
<li><a href="#page2">Oživljavanje</a>
</li>
<li><a href="#page3">Oživljavanje + AVD</a>
</li>
<li data-role="list-divider">Ne reagira, ali diše</li>
<li><a href="#page4">Bočni položaj</a>
</li>
<li data-role="list-divider">Ostalo</li>
<li><a href="#page4">Gušenje</a>
</li>
</ul>
<div id="popspot"></div>
<div data-role="popup" id="popup" data-transition="slidedown" data-position-to="#popspot" data-theme="a" data-overlay-theme="e" data-history="true">
<p>U slučaju hitnoće koristi ovaj izbornik!</p>
</div>
</div>
<div data-role="footer" id="hitnizbor" data-position="fixed" class="nav-glyphish-example">
<div class="nav-glyphish-example" data-grid="b" data-role="navbar" data-theme="e">
<ul>
<li><a href="#popup" data-rel="popup" id="chat" data-icon="custom">Zovi Hitnu</a>
</li>
<li><a href="#" id="email" data-icon="custom">Oživljavanje</a>
</li>
<li><a href="#" id="skull" data-icon="custom">Osobni podaci</a>
</li>
</ul>
</div>
普拉瓦·波莫奇
- Ne reagira i Ne diše
-
-
- Ne reagira,ali diše
-
- Ostalo
-
你是希特诺奇·科里斯蒂·奥瓦伊·伊兹博尼克
-
-
-
Pozdrav,ako jošuvijek trebašpomoćjavi mi se na privatni mail:dragan。gaic@gmail.comI使用了以下代码,但它没有关闭弹出窗口<代码>$(文档).on('pageshow',函数(事件){if(sessionStorage.popUpShown!=“true”){$('#strelica').popup('open',{positionTo:''hitnizbor'});sessionStorage.popUpShown='true';setTimeout(函数(){$(“#strelica”).popup(“close”)},3000)}else{//可以在开发环境中删除此警报。警报('已显示弹出窗口';}});