个人中心
gpt4 book ai didi

jquery mobile 对话框关闭也可以追溯到历史

转载 作者：行者123 更新时间：2023-12-01 04:54:55 25 4
gpt4 key购买 nike

我让 javascript 在有人登陆我的网站的任何/每个页面上打开一个对话框(这只是一些文本，没有其他内容)(是的，我知道它是 javascript 风格的混合体 - 仍在掌握这一点):

$(document).bind("pageinit", function(){
    if( getCookieValue('instructionseen') == false)
        {
        $.mobile.changePage("/php/instructions_alert.php");
        document.cookie ="instructionseen=yes; path=/;";
        }
    });

该脚本设置一个 cookie，以便用户只能看到该对话框一次。因此，我们的想法是，您访问该网站，出现一个包含一些说明的对话框，关闭它并继续。

Chrome v24 中的问题(我担心它可能会出现在我无法测试的移动浏览器中)是关闭对话框会让我返回历史记录中的 2 页，因此我返回到带有链接的页面我点击进入我的网站。

例如，假设我的网站是 MS，它是否通过 RS(引荐网站)链接到

Desired: RS > click to MS > Dialog opens > close it > MS in view

On Chrome: RS > click to MS > Dialog opens > close it > back to RS

使用 JQM 提供的 X 或我提供的关闭按钮会发生这种情况:

<a href='#' onclick='$(".ui-dialog").dialog("close");' data-role='button' data-theme='c'>Close</a>

对话框来源:

<!DOCTYPE html>
<html lang='en'>
<head>
<meta charset='utf-8'>
<meta http-equiv='X-UA-Compatible' content='IE=edge,chrome=1'>
<title>title..</title>
<link rel='stylesheet' href='/design/mobile_style.css'>
<link rel='stylesheet' href='http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css' />
<script src='//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js'></script>
<script src='/js/main_and_JQM_init.min.js'></script> 
<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='instructions_alert_div' data-overlay-theme='b'>
        <div data-role='header' data-theme='d'>
            <h1>Important!</h1>
        </div>

        <div data-role='content' data-theme='c'>
        content, just text...
        <a href='#' onclick='$(".ui-dialog").dialog("close");' data-role='button' data-theme='c'>Close</a>

        </div>
</div>

</body>
</html>

谢谢

最佳答案

给你。

标记:

 <!-- Start of first page -->

 <div data-role="page" id="page1">

    <div data-role="header">
    <h1>page1 header</h1>
</div><!-- /header -->

<div data-role="content">   
    <p>page 1</p>

    <a href="#page2" data-role="button">Page 2</a>


</div><!-- /content -->

<div data-role="footer">
    <h4>Page1 Footer</h4>
</div><!-- /footer -->
</div><!-- /page -->


 <!-- Start of second page -->

 <div data-role="page" id="page2">

<div data-role="header">
    <h1>Bar</h1>
</div><!-- /header -->

<div data-role="content">   
    <p>password accepted</p>        
    <p><a href="#test" data-rel="dialog">dialog</a></p>

</div><!-- /content -->

<div data-role="footer">
    <h4>Page2 Footer</h4>
</div><!-- /footer -->
 </div><!-- /page -->

对话框:

 <div data-role='dialog'  id='test' data-overlay-theme='b'>
    <div data-role='header' data-theme='d'>
        <h1>Important!</h1>
    </div>

    <div data-role='content' data-theme='c'>
    content, just text...
      <a href='#' onclick='$(".ui-dialog").dialog("close");' data-role='button' data-theme='c'>Close</a>

    </div>
</div>

JQM:

$("#page2").on('pageinit', function(event) {
$.mobile.changePage($("#test"), {
    transition : 'pop',
    reverse    : true,
    changeHash : true
});
 });

JSfiddle:dialog

关于jquery mobile 对话框关闭也可以追溯到历史，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/15096604/

25 4 0
文章推荐： python - modelform django 中多对多字段的过滤器选择
文章推荐： jquery-ui - 如何在 cfc 中用 Coldfusion 替换 AJAX 帖子
文章推荐： jquery - 这种推迟是否需要某种解决方案
文章推荐： jquery - 为什么追加只能执行一次？
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com