Question

我用JQuery创建了一个登录脚本，当用户名和密码的值等于localstorage中的用户名和密码值时（它们在点击“注册”时存储），它隐藏登录div并显示一个名为'的div口音'。但无论我在javascript中做什么，登录页面都会保留，重音页面永远不会显示。

我创建了一个jsfiddle，表明我的意思是： http://jsfiddle.net/CR47/bpztq/

以下是登录按钮的代码：

$('#loginButton').click(function(){
    if(localStorage.getItem('Username') != null || localStorage.getItem('Username') != ''){
        var cu = localStorage.getItem('Username');
        var cp = localStorage.getItem('Password');
        alert(cu);//I've alerted to show that the getItem is working
        alert(cp);
        var iu = $('#username').val();
        var ip = $('#password').val();
        if(iu == cu && ip == cp){
            $('#login').hide(0);
            $('#accent').show(0);
            localStorage.setItem('Logged In', 'yes');
            $('#name').val() == localStorage.getItem('Name');
            $('#gender').val() == localStorage.getItem('Gender');
            $('#age').val() == localStorage.getItem('Age');
            $('#address').val() == localStorage.getItem('Address');
            $('#phone').val() == localStorage.getItem('Phone');
            $('#email').val() == localStorage.getItem('Email');
        }else{
            alert('Incorrect username/password combo.');
        }
    }
});

localstorage的“登录”值设置为yes。

Answer 1

问题是在单击$('#loginButton')后提交表单，因此页面会重新加载。要阻止它，您可以在Click事件上添加preventDefault()。

$('#loginButton').click(function(e){
        e.preventDefault();
        if(localStorage.getItem('Username') != null || localStorage.getItem('Username') != ''){
            var cu = localStorage.getItem('Username');
            var cp = localStorage.getItem('Password');
            alert(cu);//I've alerted to show that the getItem is working
            alert(cp);
            var iu = $('#username').val();
            var ip = $('#password').val();
            if(iu == cu && ip == cp){
                $('#login').hide(0);
                $('#accent').show(0);
                localStorage.setItem('Logged In', 'yes');
                $('#name').val() == localStorage.getItem('Name');
                $('#gender').val() == localStorage.getItem('Gender');
                $('#age').val() == localStorage.getItem('Age');
                $('#address').val() == localStorage.getItem('Address');
                $('#phone').val() == localStorage.getItem('Phone');
                $('#email').val() == localStorage.getItem('Email');
            }else{
                alert('Incorrect username/password combo.');
            }
        }
    });

Answer 2

您需要阻止重新加载页面：

$('#loginButton').click(function (e){

添加e.preventDefault();

同样你需要分配变量而不是比较它们，改变：

  $('#age').val() == localStorage.getItem('Age');

为：

  $('#age').val() = localStorage.getItem('Age');

顺便说一下，这篇SO帖子可能对你有所帮助 - Difference between == and === in JavaScript

为什么我的登录脚本不起作用？

2 个答案: