Drag & Drop HTML 5 jQuery: e.dataTransfer.setData() z JSON

Question

Tu jest mój dragstart:

dragstart: function(e) { 
    $(this).css('opacity', '0.5'); 
    e.dataTransfer.effectAllowed = 'move'; 
    e.dataTransfer.setData('application/json', { 
     id: $(this).attr('id'), 
     header: $('header', this).text() 
    }); 
}, 

chciałbym przekazać kilka informacji taki identyfikator i tekst. Mój spadek:

drop: function(e) { 
    var data = e.dataTransfer.getData('application/json'); 
    alert(data); 
    $(this).attr('id', data.id); 
    $('header', this).text(data.header); 
}, 

Ale dane są niezdefiniowane, nie mam dostępu do moich danych. Czy to właściwa droga?

Dziękuję!

Answer 1

Jeśli to effectAllowed w funkcji dragstart, takich jak:

e.dataTransfer.effectAllowed = 'move'; 

Wtedy to jest moje zrozumienie, że trzeba określić równoważny dropEffect w funkcji drop:

e.dataTransfer.dropEffect = 'move'; 

Answer 2

w przeciągnij początek

var testjson = {name:"asd",tall:123}; 
e.dataTransfer.setData("text/plain",JSON.stringify(testjson)); 
e.dataTransfer.effectAllowed = "copy"; 

w spadku

var data = e.dataTransfer.getData("text/plain"); 
console.log(JSON.parse(data)); 

iu dostanie

Object {name: "asd", tall: 123} 

w console.log