Javascript 无法设置数据（未定义的数据）以允许元素拖放

我试图将一个元素放入另一个元素，但它不起作用。我得到的错误是

未捕获类型错误：无法读取未定义的属性“setData”

及

未捕获类型错误：无法读取未定义的属性“getData”

第二个当然取决于第一个

我试图删除的元素如下所示：

<main id="post-it" class="post-it-content">
    <div class="vertical-stripes"></div>
    <div class="vertical-stripes"></div>
    <ul class="nav">
        <li>
            <span class="normal-text"></span>
            <span class="normal-text"></span>
        </li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li class="notes-footer"></li>
    </ul>
    <textarea id="notes-area"></textarea>
</main>

$('.post-it-content').on('dragstart', dragAndDrop.drag); //Yellow note element
li.on('drop', dragAndDrop.allowDrop);
li.on('dragover', dragAndDrop.drop);

并将元素绑定到相应的函数，如下所示：

<main id="post-it" class="post-it-content">
    <div class="vertical-stripes"></div>
    <div class="vertical-stripes"></div>
    <ul class="nav">
        <li>
            <span class="normal-text"></span>
            <span class="normal-text"></span>
        </li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li class="notes-footer"></li>
    </ul>
    <textarea id="notes-area"></textarea>
</main>

$('.post-it-content').on('dragstart', dragAndDrop.drag); //Yellow note element
li.on('drop', dragAndDrop.allowDrop);
li.on('dragover', dragAndDrop.drop);

其中

li

元素是该图像中的正方形：

---

现在我不明白的是为什么我会犯这样的错误，我做的和这里的例子完全一样（虽然没有图片）：但对我来说，它不起作用。你知道为什么这不起作用吗？

这是jQuery的问题，你可以在页面加载时或使用数据传输之前添加以下代码来解决

jQuery.event.props.push('dataTransfer');

例如：

jQuery.event.props.push('dataTransfer'); 
event.dataTransfer.setData("Text", event.target.id);

---

这是因为jQuery包装器。我们必须向事件对象添加“dataTransfer”

注意：

$.event.props

已在jQuery 3.0中删除，因此您需要使用

$.event.addProp

例如：

$(document).ready(function(){

    $.event.addProp('dataTransfer');

});

---

当我试图像这样设置数据时，也会遇到同样的错误

event.dataTransfer.setData("text/plain", nodeTitle);

然后我发现该事件没有任何键

dataTransfer

，而是在

originalEvent

中有相同的键。所以我们可以像下面那样访问它

event.originalEvent.dataTransfer.setData("text/plain", nodeTitle);

---

尝试执行e.dataTransfer的console.log以查看它是什么is@LiamSchauerman很明显它没有定义，但我不明白为什么它没有定义。