2

ユーザーからの入力を複数のdivにコピーしたい。後続のすべてのdivに.each（）を適用したいので、.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>

よろしくお願いします、

フェリックス

4

5 に答える 5

3

IDは一意である必要があります：

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を経由する代わりに、そのプロパティの1つに直接アクセスする方が簡単な場合がよくあります。
于 2011-12-15T10:12:10.240 に答える
2

問題は、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-15T10:11:32.013 に答える
2

これが失敗するとは思いませんが、それでもここではidの代わりにclassを使用する必要があります。

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

次に、次のように入力から値を追加できます。

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

.html関数の代わりにtext関数を使用するように例を変更したことに注意してください。キーアップイベントにバインドするため、ユーザーがHTMLを入力すると、タグが終了する前に挿入したHTMLが破損する可能性があります。HTMLを受け入れたい場合は、代わりにblurイベントにバインドする必要があります。

$("#someText").blur(function() { $('.copy').html($(this).val()); });
于 2011-12-15T10:15:37.127 に答える
2

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-15T10:15:37.490 に答える
0

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-14T11:48:59.950 に答える