将.each（）复制输入到多个div

我想将用户的输入复制到多个div。我试图使用.each（），因为我想将它应用于后面的每个div。我写了这段代码到目前为止，但它只适用于第一个div。将.each（）复制输入到多个div

<input type="text" name="someText" id="someText"> 



$("#someText").keyup(function() { 
    var x = $("#someText").val(); 
    $("#copy").each(function() { 
     $(this).html(x); 
    }); 
}); 


<div id="copy"></div> 
<div id="copy"></div>

最好的问候，

菲利克斯

来源

2011-12-15 Felix

IDs have to be unique：

id = name [CS]
此属性为元素分配一个名称。该名称在文档中必须是唯一的。

大多数浏览器将返回具有给定ID的文档的第一个元素，尽管行为未指定。反而，如果你想选择多个元素

使用类：

HTML：

<div class="copy"></div> 
<div class="copy"></div>

的JavaScript：

$("#someText").keyup(function() { 
    $(".copy").text(this.value); 
});

的其他一些观点：

你不”不得不使用.each，setter方法通常总是应用于该集合的所有元素。
在事件处理程序中，this引用处理程序绑定到的元素。您不必再次使用选择器。
如果你已经有了DOM元素的引用，直接访问它的一个属性通常比较简单，而不是通过jQuery。

来源

2011-12-15 10:12:10

现在的工作！我也考虑过你的其他观点。你是一个很好的帮助:)谢谢！ – Felix 2011-12-15 10:24:24

不客气:) – 2011-12-15 10:24:55

我认为这个问题是当你使用一个ID选择器，JQuery的只得到了第一个实例。

如果你指定一个类，它应该工作。

个人而言，我会去为这个...

<input type="text" name="someText" id="someText"> 

$("#someText").keyup(function() { 
    var x = $(this).val(); 
    $(".copy").html(x); 
}); 

<div class="copy"></div> 
<div class="copy"></div>

或者你可以使用name=copy和选择是这样的...

$("[name=copy]").html(x);

虽然取决于您的数据是如何工作的，可能是最好的不要有重复的 “名” 的属性值

来源

2011-12-15 10:11:32 musefan

我不认为这会失败，但你应该在这里使用class而不是id。

<div class="copy"></div> 
<div class="copy"></div>

然后你可以从这样输入的添加值：

$("#someText").keyup(function() { $('.copy').text($(this).val()); });

请注意，我改变了你的例子使用的文本功能，而不是html的功能。因为你绑定到keyup事件，所以如果用户输入HTML，那么在标签完成之前插入的HTML将被破坏。如果您想接受HTML，则应将其绑定到模糊事件：

$("#someText").blur(function() { $('.copy').html($(this).val()); });

来源

2011-12-15 10:15:37

现在正在使用文字功能。感谢您的解释！:) – Felix 2011-12-15 10:27:58

使用类而不是ID。问题解决了:-)

<input type="text" name="someText" id="someText"> 

<script> 

    $("#someText").keyup(function() { 
     var x = $("#someText").val(); 
     $(".copy").each(function() { 
      $(this).html(x); 
     }); 
    }); 
</script> 

<div class="copy"></div> 
<div class="copy"></div>

来源

2011-12-15 10:15:37 chhameed

的JavaScript

<script type="text/javascript" charset="utf-8"> 

function getID(obj) { 
    //alert(obj); 
    //for text 1 
    $("#t1").val(obj); 
} 
</script>

的Html

<td onClick="getID('${vusers.id}');" id="vid"> 
    Click on this text 
</td> 

<input type="text" size=10 id="t1" />

来源

2012-03-14 11:48:59

将.each（）复制输入到多个div

回答

相关问题