拖曳使用JSON拖放HTML 5 jQuery：e.dataTransfer.setData（） [英] Drag & Drop HTML 5 jQuery: e.dataTransfer.setData() with JSON

问题描述

这是我的拖拽：

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()
    });
},

我想传递一些信息，如id和text。我的下拉是：

I would like to pass some informations such id and text. My drop is:

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

但数据未定义，我无法访问我的数据。是否正确的方式？

But data is undefined, I can't access to my data. Is it the right way?

谢谢！

推荐答案

开始

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

in drop

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

你会得到

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

.log

这篇关于拖曳使用JSON拖放HTML 5 jQuery：e.dataTransfer.setData（）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！