拖放禁用输入文本框！帮我？

Question

我有一个容器内的输入文本框。 这个容器是可拖动的，但现在我不能再输入文本到文本框中了。 可能因为您必须在文本框内单击以键入， 现在鼠标向下意味着拖动！

或者，也许它的东西完全地不同

有谁知道我可以解决这个问题？ 在此先感谢

，你可以在这里检查代码，但它非常.. http://www.jsfiddle.net/AVG5a/

Answer 1

使用jQuery^[docs]和jQuery UI^[docs]。 我差不多完成了转换为jQuery，当我完成它时，我会发布一个jsFiddle链接。

在这里你去：http://jsfiddle.net/pswRh/

后您学习jQuery和jQuery UI，它很容易使一个元素拖动，和 - 可选的 - 禁止与指定的子元素拖动。

HTML

<div id='myDiv'> 
    <img src='http://dummyimage.com/100x100.png' id='pic' /> 
    <input id='textInput' /> 
</div> 

CSS（可选）

#myDiv { 
    width: 150px; 
    height: 200px; 
    border: 1px solid; 
    background: blue; 
    color: white; 
} 

的JavaScript

$('#myDiv').draggable({ 
    cancel: '#textInput' 
}); 

瞧！你刚刚制作了一个可拖动的div，但仍然可以输入输入字段，因为它不会拖动该元素。

或者，您可以指定一个句柄。这样，你只能拖动指定的孩子的股利。

HTML，CSS

相同先前

的JavaScript

$('#myDiv').draggable({ 
    handle: '#pic' 
}); 

指定由逗号（即'#el1, #el2, #el3'）分离的多个元件。

Answer 2

一下添加到appendFunction：

document.getElementById("inputId0").addEventListener("mousedown", function(e) { 
    e.stopPropagation(); 
}, false); 

这将取消0​​事件与ID的元素inputId0。