1

我有一个站点，其用户登录表单显示在 data-rel='dialog' 链接中。问题是当您点击浏览器后退按钮时，该对话框出现在历史记录中。此处截屏- a) 显示初始未登录状态，b) 单击“登录”按钮后打开对话框，c) 成功登录，d) 我已点击后退按钮并获取我的对话框，e) 我已关闭带有默认“x”按钮的对话框被带回我的主页，但处于注销状态。

在下面的代码中，登录按钮/链接（到 '/php/mobile_login.php' ）被替换为一个人的名字是在服务器端检测到登录 cookie。

另外，鉴于我在禁用 data-dom-cache 的情况下返回主页，它不应该再次从服务器获取它吗？

非常感谢，凯文

<!DOCTYPE html>

<html lang='en'>
<head>
<meta charset='utf-8'>
<meta http-equiv='X-UA-Compatible' content='IE=edge,chrome=1'>
<title>title</title>
<meta name='viewport' content='width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=no;' />


<script src='//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js'></script>
<script src='/js/jquery_mobile_global_defaults.js'></script>
<script src='http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js'></script>
<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' />
</head>
<body>

<div data-role='page' data-dom-cache='false' id='homepage'>

    <div class='header'>
        <div class='logo'></div>
        <div class='login'><a href='/php/mobile_login.php' data-overlay-theme='b' data-transition='none' data-rel='dialog' data-role='button' data-inline='true' data-icon='arrow-r' data-iconpos='right' data-theme='a' data-mini='false'>Login</a></div>
    </div>


    <div class='mobile_content'>
    content
    </div>

</div>

</body>
</html>

对话：

<!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/jquery_mobile_global_defaults.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='member_login_div' data-overlay-theme='b'>
        <div data-role='header' data-theme='d'>
            <h1>Login</h1>

        </div>

        <div data-role='content' data-theme='c'>
        Login below to apply for jobs with your stored CV (use the desktop version of the site to upload your CV if you have not already done so).
        <form data-ajax='false'  method='POST' action='/php/mobile_do_login.php'>
        <label for='cjloginemail' class='ui-hidden-accessible'>Email Address</label>
        <input type='text' name='user_email' id='cjloginemail' value='kevin@solomon.ie' placeholder='Email Address'>
        <label for='cjloginpass' class='ui-hidden-accessible'>Password</label>
        <input type='password' name='password' id='cjloginpass' value='' placeholder='Password'>
        <input name='Submit' type='submit' value='Login'>
        </form>
        <p><a href='/php/mobile_forgot_pass.php'>I forgot my password - email it to me.</a>


    </div>

</div>
</body>
</html>
4

1 回答 1

2

也许您可以尝试使用关闭任何 dailog onload$('.ui-dialog').dialog('close').

REF：JQuery 移动端 - Dailogs

我在同一页上读过这个，很奇怪它发生在你身上。

**

历史记录和后退按钮行为

**

由于对话框通常用于支持页面内的操作，因此该框架不包括哈希状态历史跟踪中的对话框。这意味着单击“后退”按钮时，对话框不会出现在您的浏览历史年表中。例如，如果您在一个页面上，单击一个链接打开一个对话框，关闭对话框，然后导航到另一个页面，如果您此时单击浏览器的“后退”按钮，您将导航回第一页，而不是对话框。

更新：对话框出现在 FireFox 浏览器的后退按钮上。在 IE9 和 Chrome 上运行良好。

于 2013-02-12T17:05:15.117 回答