Question

＆＃13;

window.onload= button;

function termFunction () {
    var textInput = document.getElementById("textInput");
    var term= textInput.value;

    document.getElementById("list").innerHTML= term.value;
}

function button () {
    var button = document.getElementById("button"); 
    button.onclick= termFunction(); 
}

＆＃13;

<!DOCTYPE html>
<html>
<head>
<script src = "review2.js"></script>
</head>
<body>
    Term: <input type = "text" id = "list">
    <input type = "button" id = "button" value= "submit">
</body>
</html>

＆＃13;

我试图让某人在文本框中输入并打印到HTML页面上。但我不知道为什么它不起作用。

Answer 1

当您正在读取不存在的id的属性时，这是错误

“message”：“未捕获的TypeError：无法读取null的属性'值'

<强>解决方案

由于您正在阅读身体中不存在的ID textInput 的值，请参阅此行

var textInput = document.getElementById（“textInput”）;

如果您想使用列表

获取用户输入替换ID的值

var textInput = document.getElementById（“list”）;

最终代码

<!DOCTYPE html>
<html>
<head>
<script src = "review2.js"></script>
</head>
<body>
Term: <input type = "text" id = "list">
<input type = "button" id = "button" value= "submit">
<p id="demo"></p>
<script>
window.onload= button;

function termFunction () {
var textInput = document.getElementById("list").value;


document.getElementById("demo").innerHTML= textInput;
}

function button () {
var button = document.getElementById("button"); 
button.onclick= termFunction(); 
}
</script>
</body>
</html>

Answer 2

您的输入有一个id =“list”。因此，必须使用

var textInput = document.getElementById ("list");

因为修改输入的内容没有意义

document.getElementById("list").innerHTML= term.value;

我认为您必须检查HTML元素的ID

更新：我添加一个例子：

function termFunction () {
    var textInput = document.getElementById("list").value;
   if(textInput)
    document.getElementById("res").innerHTML= textInput;
}

 Term: <input type = "text" id="list">
<input type = "button" id = "button" value= "submit" onclick="termFunction()">
    
<br /><br />
<div id="res"></div>

使用来自用户的输入制作简单的javascript事件

2 个答案: