我在使用HTML的页面上有以下文字:
“你好,我叫HuggyBiscuit”
我希望能够添加例如更改“我的”和“ Huggybiscuit”的框
我可以使用以下代码更改其中1个(例如HuggyBiscuit)
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<script type="text/javascript">
function myFunction(input){
var elementValue = input.value;
document.getElementById("test1").innerHTML = elementValue;
}
</script>
<input id="name" name="name" onkeyup = myFunction(this) type="text" value="HuggBiscuit">
<br>
Hello my name is <code id="test1">HuggBiscuit</code>
</body>
</html>
但是当我尝试添加第二个框时,它只是替换了第一个文本框的输入。我尝试为所有内容添加单独的ID,但没有任何内容允许我添加2个框来更改句子的不同部分。
2个盒子不起作用的示例:
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<script type="text/javascript">
function myFunction(input){
var elementValue = input.value;
document.getElementById("test1","test2").innerHTML = elementValue;
}
</script>
<input id="name" name="name" onkeyup = myFunction(this) type="text" value="HuggBiscuit">
<input id="person" name="name" onkeyup = myFunction(this) type="text" value="my">
<br>
Hello <code id="test2">my</code> name is <code id="test1">HuggBiscuit</code>
</body>
</html>
获取document.getElementById(“ test1”,“ test2”),仅返回一个元素。请改用课堂或输入两次。
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<script type="text/javascript">
function myFunction(input, id) {
var elementValue = input.value;
document.getElementById(id).innerHTML = elementValue;
}
</script>
<input id="name" name="name" onkeyup="myFunction(this,'text2')" type="text" value="HuggBiscuit">
<input id="person" name="name" onkeyup="myFunction(this, 'text1')" type="text" value="my">
<br>
Hello <code id="text1">my</code> name is <code id="text2">HuggBiscuit</code>
</body>
</html>