基于HTML5更改的Jquery事件触发器

时间:2017-02-23 03:14:47

标签: javascript jquery html5

我正在创建一个允许用户在电路板类别之间点击和拖动项目的电路板,一旦添加了新项目,我希望在该类别上显示一个图标,作为确认。

但是我的问题是,使用JS如何在项目被拖入其类别时触发图标显示?

  $('#catagory-2').bind("DOMSubtreeModified",function(){
  $('#icon2').toggle();
  });

我想象我的Jquery会是这样的(但这显然不起作用):

None

1 个答案:

答案 0 :(得分:1)

您只需要HTML5和一些Javascript。不需要jQuery。

<强> Here's a complete JSFiddle demo 即可。让我知道它是否有帮助:

一些代码:

var draggedID;

function drag(ev) {
    ev.dataTransfer.setData("text", ev.target.id);
    draggedID = ev.currentTarget.id;
}

function drop(ev) {
    ev.preventDefault();
    var data = ev.dataTransfer.getData("text");
    ev.target.appendChild(document.getElementById(data));

    if (draggedID.split('-')[1] == (ev.target.id).split('-')[1]) {
      document.getElementById('icon-'+dragged).style.display = "block";
    }
}