2 回答

TA貢獻1798條經(jīng)驗 獲得超7個贊
Get document.getElementById("test1","test2"),只返回一個元素。您可以通過 id 從調(diào)用函數(shù)中進行修改。
<!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>

TA貢獻1788條經(jīng)驗 獲得超4個贊
您可以將兩個參數(shù)傳遞給myFunction()
使用此技術(shù),您可以定位單個文本字段。
使用document.querySelectorAll()您可以自動執(zhí)行此過程,以便每個輸入元素以一個具有相同參數(shù)(“名稱”、“目標”等)的文本字段為目標
<body>
<script type="text/javascript">
function myFunction(input,field){
var elementValue = input.value;
document.getElementById(field).innerHTML = elementValue;
}
</script>
<input id="name" class="inputField" name="name" onkeyup = myFunction(this,'test1') type="text" value="HuggBiscuit">
<input id="person" class="inputField" name="name" onkeyup = myFunction(this,'test2') type="text" value="my">
<br>
Hello <code id="test2">my</code> name is <code id="test1">HuggBiscuit</code>
</body>
這是創(chuàng)建多個輸入/文本字段連接的自動化方式的簡單代碼
<body>
<input id="name" class="inputField" name="test1" type="text" value="HuggBiscuit">
<input id="person" class="inputField" name="test2" type="text" value="my">
<input id="pet" class="inputField" name="test3" type="text" value="parrot">
<br>
Hello <code id="test2">my</code> name is <code id="test1">HuggBiscuit</code> and i have a(n) <code id="test3">parrot</code>
</body>
<script type="text/javascript">
document.querySelectorAll(".inputField")
.forEach(x=>x.addEventListener("keyup",(e)=>{document.getElementById(e.target.name).innerText = e.target.value}))
</script>
添加回答
舉報