копировать вход с .each() в несколько divs

Question

Я хочу скопировать вход пользователя с несколькими div. Я попытался использовать .each(), потому что я хочу применить его к каждому div, который следует. Я написал этот код до сих пор, но он работает только для первого 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> 

С наилучшими пожеланиями,

Felix

Answer 1

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); 
}); 

Некоторые другие моменты:

• Вы надеваете» t необходимо использовать .each, методы настройки обычно применяются ко всем элементам набора.
• Внутри обработчика событий this ссылается на элемент, к которому привязан обработчик. Вам не нужно снова использовать селектор.
• Если у вас уже есть ссылка на элемент DOM, часто проще просто получить доступ к одному из его свойств напрямую, а не проходить через jQuery.

Answer 2

Я думаю, что проблема в том, что JQuery получает только первый случай, когда вы используете селектор ID.

Если вы назначаете класс, то он должен работать.

Лично я хотел бы пойти на это ...

<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); 

Хотя в зависимости от того, как работает данных может быть лучше не иметь повторяющихся значений атрибутов «имя»

Answer 3

Я бы не подумал, что это потерпит неудачу, но вы должны тем не менее использовать класс вместо ids здесь.

<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()); }); 

Answer 4

использовать класс вместо 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> 

Answer 5

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" />