画像内のJavaScript getAttribute（）メソッド

Question

JavaScriptで画像をドラッグアンドドロップしています。私はイメージでいくつかの属性を与えました。私は名前の属性("data-id")を呼んでいます。今

<img class="item" id="Img2" src="http://dummyimage.com/100x100/000/fff&text=Figen" draggable="true" ondragstart="drag(event)" alt="" data-id="20" /> 
     <img class="item" id="Img3" src="http://dummyimage.com/100x100/000/fff&text=Naz" draggable="true" ondragstart="drag(event)" alt="" data-id="30"/> 
     <img class="item" id="Img4" src="http://dummyimage.com/100x100/000/fff&text=Test" draggable="true" ondragstart="drag(event)" alt="" data-id="40"/> 
     <img class="item" id="Img5" src="http://dummyimage.com/100x100/000/fff&text=Huni" draggable="true" ondragstart="drag(event)" alt="" data-id="50"/> 
     <img class="item" id="Img6" src="http://dummyimage.com/100x100/000/red&text=Mavi" draggable="true" ondragstart="drag(event)" alt="" data-id="60"/> 
     <img class="item" id="Img0" src="http://dummyimage.com/100x100/000/fff&text=Can" draggable="true" ondragstart="drag(event)" alt="" data-id="90"/> 

私は上記の画像をドラッグ＆ドロップすると、私はクラス側該当するクラスside.Codesに（データ-id）をキャッチしたいが、私は画像をドロップしようとすると、私はキャッチいけませんJavaScriptの（データID）。

function allowDrop(ev) { 

    ev.preventDefault(); 

} 


function drag(ev) { 

    ev.dataTransfer.setData("text", ev.target.id); 

} 


function drop(ev) { 
    ev.preventDefault(); 
    debugger; 
    var data = ev.dataTransfer.getData("Text"); 

    var itemToMove = document.getElementById(data).getAttribute("data-id"); 
    ev.target.appendChild(itemToMove); 

私は画像をポストバック時に、私は背後にあるコードを見てみたいです。 Return İdList

それは

コードがクラスに該当する「が見つかりません」と言います。

私は

Public Property idlist() As List(Of String) Get Return _idlist End Get Set(ByVal value As List(Of String)) _idlist = value End Set End Propertyここでそれを呼び出し、それを返す、そこに問題がイマイチ。

Answer 1

私があなたの意図したことを理解していれば、data-id属性を取得してどこかにドロップしたいと思っています。テキストをドロップしようとしています。 appendChild(x)メソッドは、xをchildNodeにする必要があります。したがって、テキストをchildNodeに変換する必要があります。 次のようにすることができます。

 var itemToMove = document.getElementById(data).getAttribute("data-id"); 
     //convert itemToMove into a TextNode. 
     itemToMove = document.createTextNode(itemToMove); 
     //append it into the target 
    ev.target.appendChild(itemToMove) 

しかし、あなたはデータの送迎タイプにtextとTextを書かれたことに気づいたはずです。彼らは同じでなければなりません。 ご希望の場合

Answer 2

お試しください。私は私とうまく動作します。