html5ドラッグして同じIDを持つdivをドラッグ

Question

タイトルはかなり自明です。 データベースから製品を取得するPHPコードから生成されたdivが多数あります。 問題は、2つのコンテナ（divも）の間にドラッグすると、商品div IDが同じで、コンテナ1 - > 2からのリピートとなり、逆方向ではないため、最初のコンテナにすべて戻ることができません。 contaner 2 - > 1（2つのコンテナがあり、すべてのproduct divは同じIDを持ちます）。 私はこれを解決するには、製品のdivs idに+1を付け加えることで（つまりidが違うので）、CSSのidを使えません。どんな解決策ですか？ここ は

<script type="text/javascript"> 
      function allowDrop(ev){ 
       ev.preventDefault(); 
       } 
      function drag(ev){ 
       ev.dataTransfer.setData("Text",ev.target.id); 
       } 
      function drop(ev){ 
       if (ev.target.id == "container"){ 
       var data=ev.dataTransfer.getData("Text"); 
       ev.target.appendChild(document.getElementById(data)); 
       ev.preventDefault(); 
       }} 
     </script> 

おかげで事前

Answer 1

私はPHPで生成されたdivの増分idを使ってこれを解決しました。どのようにthaは私が欲しかった解決の一つではなかったか。 助けてくれてありがとう

Answer 2

にあなたが同じidを持つ2つのdiv要素を持つことができないjsのコードです。クラスを使ってみてください。

function drop(ev){ 
    if (ev.hasClass('container')) { 
      // do some stuff 
    } 
} 

あなたはjQueryの.addclass()メソッドを使用して動的にクラスを追加することができます

あなたdrop()機能は次のようなものでなければなりません。

Answer 3

HTMLを有効にするには、IDが一意である必要があります。 IDを複製すると、奇妙なことが起こります。たとえあなたが1つのブラウザで動作するようにしても、他のブラウザは別のものを扱うかもしれません。代わりにクラスを使用してみることもできます。