jquery点击绑定div效果文本框驻留在其中

HTML：

 
direct Link: 
   

JAVASCRIPT：

 $('#directlinkText').parent('div').click(function () { alert('test'); }); 

问题是当我点击div上的任何地方时我想看测试除非我点击其中的输入。 现在单击文本框输入也会触发div的click事件

我该如何解决？

Answer 1

 $('#directlinkText').parent('div').click(function (e) { if(e.target.id === "directlinkText"){ return; } alert('test'); }); 

Answer 2

这是因为你的输入在div中。 将事件附加到文本框，然后停止事件传播。

 $('#directlinkText').click(function(event) { event.stopPropagation(); }); 

这将停止事件传播。

Answer 3

当click事件源自input元素时，您可以停止传播它，如下所示：

 $('#directlinkText').click(false).parent('div').click(function () { alert('test'); }); 

这直接在#directlinkText元素上为click事件返回false 。 其中jQuery事件处理程序与调用： event.preventDefault()和event.stopPropagation() 。 如果您只是想停止传播而不是阻止默认行为，那么您可以使用：

 $('#directlinkText').click(function (event) { event.stopPropagation(); }).parent('div').click(function () { alert('test'); });