javaScript不允许我写入一个文本框值

Question

编辑谢谢大家!

我在页面上有一个cookie，当页面加载时，我想把cookie的值作为默认值放入输入框中。

然而，它不会工作，我找不到问题。我甚至做了一个测试div，并试图改变，但它不会工作。

function checkCookie() {
    var cookieName = getCookie("username");
    if (cookieName != null && cookieName != "") {
        alert(cookieName);
        document.getElementById("fname").value = cookieName
    } else {
        alert("else");
        return;
    }
}

这里是html

<input type="text" name="fname" id="fname" onKeyUp="isName(this.value)">

我也尝试了这段代码(我只是创建了一个名为test2

的div)

document.getElementById("fname").value = "hello" 

不工作

document.getElementById("tester2").innerHTML = cookieName

不工作

没有效果。它不允许我改变这个函数中的元素。如果我尝试将代码(即document.etc . innerhtml = "hi")放在另一个函数中，那么它就可以完美地工作…但是，它不会像上面所示的那样运行。我快疯了。

任何想法?

Answer 1

第一步应该确保checkCookie返回您想要的结果。如果它是空的，它显然会有相同的效果，如果它没有做任何事情，因为它会在文本区域中放置一个空值。

如果cookie包含格式正确的值，那么这一行应该没问题:

document.getElementById("fname").value = cookie;

Answer 2

我怀疑当checkCookie函数执行时，DOM还没有准备好，您的输入不存在。

要确保不是这样，请尝试以下操作:

 window.onload = checkCookie;

这将只在加载窗口内容时执行checkCookie函数。这不是最有效的方法，但因为我不知道你使用的是哪种浏览器，所以这是最可靠的测试方法。

编辑:看了你的代码后，问题出在这一行:

window.onload = checkCookie();

将立即执行checkCookie函数，并尝试将该函数的结果赋值给window.onload。

查看我前面的例子，看看应该怎么做

Answer 3

我认为在JS中，每个语句都以;分号

结束

document.getElementById("fname").value = cookieName

我认为你应该在结尾加上;

Answer 4

下面是一个例子

HTML

<input type="text" name="fname" id="fname">

Javascript

function getCookie(something) {
    var cookies = {
        "username": "John Smith"
    }
    return cookies[something];
}
function checkCookie() {
    var cookieName = getCookie("username");
    if (cookieName != null && cookieName != "") {
        alert(cookieName);
        this.value = cookieName;
    } else {
        alert("else");
    }
}
var fname = document.getElementById("fname");
fname.addEventListener("keyup", checkCookie, false);

在jsfiddle

所以根据你的评论，它可能是你没有等到DOM加载之前试图访问它。

下面是一个示例。

window.addEventListener("load", function onLoad() {
    this.removeEventListener("load", onLoad);
    function getCookie(something) {
        var cookies = {
            "username": "John Smith"
        }
        return cookies[something];
    }
    function checkCookie() {
        var cookieName = getCookie("username");
        if (cookieName != null && cookieName != "") {
            alert(cookieName);
            this.value = cookieName;
        } else {
            alert("else");
        }
    }
    var fname = document.getElementById("fname");
    fname.addEventListener("keyup", checkCookie, false);
}, false);

在jsfiddle

:

window

指出

load事件在文档加载过程结束时触发。在此时，文档中的所有对象都在DOM中图片和子帧已经加载完毕。

EventTarget.addEventListener

总结

addEventListener()在单个对象上注册单个事件侦听器目标。事件目标可以是文档中的单个元素文档本身、窗口或XMLHttpRequest。

为什么在HTML中使用onClick()是一个不好的做法?

低调的JavaScript