2016-01-13 62 views
4

例如这里是w3schools.com拖放代码:什么是preventDefault()阻止拖放?

function allowDrop(ev) { 
    ev.preventDefault(); 
} 

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

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

它取决于被拖动的元素的类型。如果它是一个'anchor'元素,它将阻止遵循'href'属性值。 –

+0

怎么办? – Taurus

+0

HTML标准 - > [6.7.5拖放处理模型](https://html.spec.whatwg.org/multipage/interaction.html#drag-and-drop-processing-model) – Andreas

回答

1
您必须取消ondragenter默认的动作和ondragover为了ondrop解雇任何数据。在div的情况下,默认操作不会丢失。这可以与输入类型=文本元素的情况进行对比,其中默认操作是删除。为了允许在div上进行拖放操作,您必须取消默认操作
0
  • 呼叫preventDefault()防止 数据的浏览器默认处理(默认是在下降的链接打开)
  • 获取用dataTransfer.getData()方法拖动数据。该方法将返回被设置为 同一类型的setData()方法