蹊跷的Html5的下降和阻力作用

Question

有一个面板一些图片，我想将它们拖动到另一个面板：

$('#resource img').bind('dragstart', function (evt) { 
     evt.dataTransfer.setData('text', this.id); 
    }); 

其他面板通过此接受IMG：

 $('#draw').bind('dragover', function (evt) { 
      evt.preventDefault(); 
     }).bind('dragenter', function (evt) { 
      evt.preventDefault(); 
     }).bind('drop', function (evt) { 
      evt.preventDefault(); 
      var id = evt.dataTransfer.getData('text'), 
      $(this).append("<b>Hello"+id+"</b>"); 
     }); 

然而，这是不行的，但是当我改变最后的事件处理程序：

.bind('drop', function (evt) { 
       evt.preventDefault(); 
        alert("!!!"); 
      }); 

这可能是工作，为什么这个happend，哪能这么解决这个问题？

Answer 1

它看起来像你使用jQuery。你是否告诉jQuery使用事件推送dataTransfer属性？ jQuery不会自动将dataTransfer对象与事件一起推送。也许有一天会改变，但目前这种解决方法必须使用。

$(document).ready(function() {  
    $.event.props.push('dataTransfer'); 
} 

Answer 2

我相信这是为时已晚，但可以访问原始事件的属性，即：

evt.originalEvent.dataTransfer.setData('text', this.id);