Question

所以我一直在使用cookies设计一个记住我按钮，我做了两个功能：

function checkInfo() {
var blah = $("#remem");
alert(blah.id);
var login = $("#nameInput").val();
var pw = $("#pwInput").val();
if (blah.checked) setCookie(login, pw, 5);
if (localStorage[login] == pw) {
$("#loginscreen").css("display", "none");
$("#ques0").css("display", "block");
} else alert("Your info doesn't match, sorry :(");
}

function setCookie(name, value, daysToLive) {
        alert(name);
        var text = name + "=" + encodeURIComponent(value);
        text = text + ";max-age=" + (daysToLive*60*60*24);
        document.cookie = text;
        alert(text);
    }

出于某种原因，当以这种形式运行时，blah无法找到#remem元素：

<form id = "loginscreen">
    <p class = "input" style = "display: block; margin: 0 0 30px 0">Now, log in :)</p>
        <p class = "input">Login:</p><input id = "nameInput" type = "text" name = "fName" />
    <p class = "input">Password:</p><input id = "pwInput" type = "text" name = "password" />
   <input type = "button" value = "Submit" onclick = "checkInfo();" />
   <p class = "input">Remember me</p><input id = "remem" type = "checkbox" name = "remember" />
</form>

很奇怪，因为它在它上方找到了＃nameinput和#pwInput。我也刚刚开始像一周前的javascript。帮助！

Answer 1

blah是一个jQuery对象，而不是一个普通的DOM元素，因此它没有id或checked属性。使用prop来访问它们，例如blah.prop('id')和blah.prop('checked')。或者，您可以使用blah.get(0)从jQuery对象获取底层DOM元素。

Answer 2

您没有设置localstorage而访问它，因此会创建error。

您可以创建两个函数，如createCookie和readCookie`，就像那样，

function readCookie(name) {
    if(typeof(Storage)!=="undefined"){
        // window.localStorage is available!
        return localStorage.getItem(name);
    } else {
        createCookie(name,"",-1);
        var nameEQ = name + "=";
        var ca = document.cookie.split(';');
        for(var i=0;i < ca.length;i++) {
            var c = ca[i];
            while (c.charAt(0)==' ') c = c.substring(1,c.length);
            if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
        }
        return null;
    }
}

//Add cookies//
function createCookie(name,value,days) {
    if(typeof(Storage)!=="undefined"){
        // window.localStorage is available!
        localStorage.setItem(name, value);
    } else {
        // no native support for HTML5 storage :(
        // maybe try dojox.storage or a third-party solution

        if (days) {
            var date = new Date();
            date.setTime(date.getTime()+(days*24*60*60*1000));
            var expires = "; expires=0";//+date.toGMTString();
        }
        else var expires = "";
            document.cookie = name+"="+value+expires+"; path=/";
    }
}

// Use this function in your function like,

function checkInfo() {
    var blah = $("#remem");
    alert(blah.id);
    var login = $("#nameInput").val();
    var pw = $("#pwInput").val();
    if (blah.checked) createCookie(login, pw, 5);
    if (readCookie(login) == pw) {
        $("#loginscreen").css("display", "none");
        $("#ques0").css("display", "block");
    } else alert("Your info doesn't match, sorry :(");
}

javascript中的幽灵元素

2 个答案: