我有一个 JavaScript 函数，我向其传递了一个参数。该参数表示我的网页中元素（隐藏字段）的 id。我想改变这个元素的值。
function myFunc(variable) {
var s = document.getElementById(variable);
s.value = 'New value'
}
当我这样做时，我得到一个错误，因为对象为空，所以无法设置值。但我知道该对象不为空，因为我在浏览器生成的 HTML 代码中看到了它。
反正我试过下面的代码调试
function myFunc(variable) {
var x = variable;
var y = 'This-is-the-real-id'
alert(x + ', ' + y)
var s = document.getElementById(x);
s.value = 'New value'
}
当出现警告消息时，两个参数相同，但我仍然得到错误。但是当我这样做时一切正常
var s = document.getElementById('This-is-the-real-id');
s.value = 'New value'
我该如何解决这个问题？
我为其设置值的元素是一个隐藏字段，并且 id 是在页面加载时动态设置的。我试过在 $(document).ready 函数中添加这个，但它没有用。
如果在textarea渲染到页面之前执行myFunc(variable)，你会得到空异常错误。
<html>
<head>
<title>index</title>
<script type="text/javascript">
function myFunc(variable) {
var s = document.getElementById(variable);
s.value = "new value";
}
myFunc("id1");
</script>
</head>
<body>
<textarea id="id1"></textarea>
</body>
</html>
<!-- Error message: Cannot set property 'value' of null -->
所以，确保你的文本区域确实存在于页面上，然后调用 myFunc。您可以使用 window.onload 或 $(document).ready 函数。
给出
<div id="This-is-the-real-id"></div>
然后
function setText(id, newvalue) {
var s = document.getElementById(id);
s.innerHTML = newvalue;
}
window.onload = function() { // Or window.addEventListener("load", function() {
setText("This-is-the-real-id", "Hello there");
}
会做你想做的事
给出
<input id="This-is-the-real-id" type="text" value="">
然后
function setValue(id, newvalue) {
var s = document.getElementById(id);
s.value = newvalue;
}
window.onload = function() {
setValue("This-is-the-real-id", "Hello there");
}
会做你想做的事
function setContent(id, newvalue) {
var s = document.getElementById(id);
if (s.tagName.toUpperCase() === "INPUT")
s.value = newvalue;
else
s.innerHTML = newvalue;
}
window.addEventListener("load", function() {
setContent("This-is-the-real-id-div", "Hello there");
setContent("This-is-the-real-id-input", "Hello there");
})<div id="This-is-the-real-id-div"></div>
<input id="This-is-the-real-id-input" type="text" value="">除了
.setAttribute().value()document.getElementById('some-input').value="1337";
document.getElementById('some-input').setAttribute("value", "1337");
本附录实际上更改了页面源中值的内容，从而使值更新
form.reset()<html>
<head>
<script>
function updateTextarea(element)
{
document.getElementById(element).innerText = document.getElementById("ment").value;
}
</script>
</head>
<body>
<input type="text"
value="Enter your text here."
id = "ment"
style = " border: 1px solid grey; margin-bottom: 4px;"
onKeyUp="updateTextarea('myDiv')" />
<br>
<textarea id="myDiv" ></textarea>
</body>
</html>
对于每个元素类型，您可以使用特定的属性来设置值。
例如：
<div id="theValue1"></div>
window.document.getElementById("theValue1").innerText = "value div";
<input id="theValue2"></input>
window.document.getElementById("theValue2").value = "value input";
像下面这样尝试。它会工作...
<html>
<head>
<script>
function displayResult(element)
{
document.getElementById(element).value = 'hi';
}
</script>
</head>
<body>
<textarea id="myTextarea" cols="20">
BYE
</textarea>
<br>
<button type="button" onclick="displayResult('myTextarea')">Change</button>
</body>
</html>
我认为问题在于您调用 JavaScript 函数的方式。
你的代码是这样的：
<input type="button" onclick="javascript: myFunc(myID)" value="button"/>
myID 应该用引号引起来。