以相同的id实时更新javascript中的文本

如何更新id =“b”中的文本？以相同的id实时更新javascript中的文本

<script type="text/javascript"> 
function updateb() 
{ 
var a= document.getElementById("a").value; 
var b = document.getElementById("b").innerHTML = a * 10; 
} 
</script> 

<input type="text" id="a" name="a" value="10" onKeyUp="updateb();" /><p id="b" name="b"></p> 
<input type="text" id="a" name="a" value="20" onKeyUp="updateb();" /><p id="b" name="b"></p> 
<input type="text" id="a" name="a" value="30" onKeyUp="updateb();" /><p id="b" name="b"></p>

来源

2010-08-04 Pete

请注意，id字段对于文档必须是唯一的。也就是说，你不能在你的例子中有三个具有相同ID的元素。

否则，您发布的代码应该更新B的内容，但显然您需要在输入字段中对onchange或onblur事件做出响应。

来源

2010-08-04 06:40:07 thomasrutter

1.）ID在页面中应始终是唯一的。

2）的getElementById总是返回与同一ID只有一个元素，如果有多个ID与相同的值

3）上面的问题，你可以尝试getElementsByName。它与getElementById差异很相似，它会给你所有具有相同名称的元素。如果你这样做

x = document.getElementsByName（“b”）;

X [0]将包含第一个

X [1]将包含：第二个

X [2]将含有3日一个

如果你想要通过的getElementById然后改变来实现ur元素id与任何其他独特的名称，如：

<script type="text/javascript"> 
function updateb(Src) 
{ 
    var a= Src.value; 
    document.getElementById("b" + Src.id.substr(1)).innerHTML = a * 10; 
} 
</script> 

<input type="text" id="a1" name="a" value="10" onKeyUp="updateb(this);" /><p id="b1" name="b"></p> 
<input type="text" id="a2" name="a" value="20" onKeyUp="updateb(this);" /><p id="b2" name="b"></p> 
<input type="text" id="a3" name="a" value="30" onKeyUp="updateb(this);" /><p id="b3" name="b"></p>

来源

2010-08-04 06:43:17 KoolKabin

正如其他人指出的，文档中的所有元素都应该有一个唯一的ID。然而，就你而言，可能根本不需要id，因为你可以使用元素的相对位置来实现你的目标。此示例不需要ID或名称，但根据您的总体要求，您的情况可能会有所不同。

<script type="text/javascript"> 
    function updateb(inputElement) 
    { 
     var a = inputElement.value; 
     var target = inputElement.nextSibling; 
     if(target != null){ 
      target.innerHTML = a * 10; 
     } 
    } 
</script> 

<input type="text" value="10" onKeyUp="updateb(this);" /><p></p> 
<input type="text" value="20" onKeyUp="updateb(this);" /><p></p> 
<input type="text" value="30" onKeyUp="updateb(this);" /><p></p>

使用诸如由@KoolKabin提供的可能是在长期运行得更好，因为它是更宽容的HTML结构发生变化的一个解决方案。无论哪种方式，通常有几种不同的方法来处理任何给定的问题，并且您应该根据情况评估最佳状态。

来源

2010-08-04 07:13:16 belugabob

以相同的id实时更新javascript中的文本

回答

相关问题