將.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

回答

相關問題