2

我有一个网络应用程序,其中有一个简单的登录框。没有要提交的表单,登录过程是通过 jQuery AJAX 实现的。

在这种情况下,如何让网络浏览器显示“您希望浏览器记住密码吗?” 对话?

提前致谢!

注意:我正在寻找一种至少适用于所有主要浏览器的最新版本的解决方案。

编辑:我确实使用 cookie 来记住用户登录。问题是浏览器不提供记住密码的功能。

这是HTML:

<div class="window loginWindow sn-login">
    <div>
        <input type="text" id="UserName" placeholder='Username' />
    </div>
    <div>
        <input type="password" id="Password" placeholder='Password' />
    </div>
    <div>
        <div>
            <input type="checkbox" id="RememberMe" />
            <label for="RememberMe">Remember my login</label>
        </div>
        <div>
            <button class="loginSubmit">Login</button>
        </div>
    </div>
</div>

这是JavaScript:

var $userName = $("#UserName"),
    $rememberMe = $("#RememberMe"),
    $password = $("#Password");

var name = $userName.val(), pw = $password.val();
$.ajax({
    type: "POST",
    url: "/UserActions/LogIn",
    dataType: "json",
    data: { password: pw, email: name },
    success: function (data) {
        if (data.success) {
            if ($rememberMe.is(":checked")) {
                // Omitted for brevity
            }

            window.location.reload();
        }
        else {
            // Omitted for brevity
        }
    }
});
4

2 回答 2

3

只需创建一个表单元素作为控件的包装器,然后使用表单的提交处理程序来执行 ajax 调用。

<form id="myform">
<div class="window loginWindow sn-login">
    <div>
        <input type="text" id="UserName" placeholder='Username' />
    </div>
    <div>
        <input type="password" id="Password" placeholder='Password' />
    </div>
    <div>
        <div>
            <input type="checkbox" id="RememberMe" />
            <label for="RememberMe">Remember my login</label>
        </div>
        <div>
            <button class="loginSubmit">Login</button>
        </div>
    </div>
</div>
</form>

像这样更改您的脚本:

$('.loginSubmit').on('click', function(){

$("#myform").submit(function(){


var $userName = $("#UserName"),
    $rememberMe = $("#RememberMe"),
    $password = $("#Password");

var name = $userName.val(), pw = $password.val();
$.ajax({
    type: "POST",
    url: "/UserActions/LogIn",
    dataType: "json",
    data: { password: pw, email: name },
    success: function (data) {
        if (data.success) {
            if ($rememberMe.is(":checked")) {
                // Omitted for brevity
            }

            window.location.reload();
        }
        else {
            // Omitted for brevity
        }
    }
});
return false;
});

});
于 2013-09-04T10:36:33.763 回答
0

使用表单来触发浏览器的内置“记住密码”选项,但submit在其上设置一个事件,取消默认事件并处理您的 AJAX 登录。

于 2013-09-04T10:06:56.723 回答