1

オブジェクトをドラッグ可能にするために、次の jQuery コードを作成しました。

JavaScript:

$(function(){
    $("#drag_item").draggable();
});

HTML:

<div id="drag-item">One</div>
<div id="drag-item">Two</div>
<div id="drag-item">Three</div>

ドラッグできるのは最初のdivwithだけですが、他はできません。id "drag-item"それらすべてをドラッグ可能にしたい。これは、それぞれに異なる を割り当てることで実行できることを理解していますが、ドラッグ可能な機能を持つすべてのオブジェクトを許可idするものを宣言するだけです。どうすればこれを行うことができますか？idid

4

3 に答える 3

6 
$(function(){
    $(".drag-item").draggable();
});

HTML:

<div class="drag-item">One</div>
<div class="drag-item">Two</div>
<div class="drag-item">Three</div>

classの代わりに使用しidます。

重複した html を持つことは有効な html ではありませんid。

于 2012-08-16T21:14:59.560 に答える
5

HTML を自由に変更できる場合は、 のclass代わりに を使用できますid。

$(function(){
    $(".drag-item").draggable();
});

<div class="drag-item">One</div>
<div class="drag-item">Two</div>
<div class="drag-item">Three</div>

ただし、HTML を自由に変更できない場合は、次を使用できます。

$(function(){
    $("[id=drag-item]").draggable();
});

とは異なり、#drag-item属性セレクターは、最初の要素だけでなく、一致するすべての要素を返します。ただし、同じ要素を持つ要素が複数あるということは、 HTMLidが無効であることを意味することに注意してください。

于 2012-08-16T21:19:46.533 に答える
5

そのような ID を複製することはできません。ID は一意である必要があります。クラスセレクターを使用する

HTML:

<div class="drag-item">One</div>
<div class="drag-item">Two</div>
<div class="drag-item">Three</div>

JS:

$(function(){
    $(".drag-item").draggable(); //Edit: as MrOBrian pointed out
});
于 2012-08-16T21:15:33.770 に答える