点击事件未触发。为什么?

时间:2012-08-10 11:30:54

标签: javascript jquery html css events

使用jQuery,我为一些“li”HTML元素附加了一个“click”事件处理程序。

问题是:当我点击“li”元素时,事件不会触发。

“怎么样?” - 你会问......所以,亲自看看in this simple jsFiddle

考虑:

  • 我在我的Ubuntu系统中测试了Firefox 14.0.1和Chrome 16.0.912.77。
  • 我从原始代码的CSS,HTML和JS中删除了大量内容,同时“寻找”原因。
  • 您可以点击表单标签元素,查看事件处理函数是否正常工作。但是,请尝试点击 li 元素...不起作用!
  • 如果您只是从“li”元素中删除float: left样式,或从“表单”中删除position: relative样式,那么问题就会消失!

所以,我并没有问到如何规避或解决问题,我问为什么“点击”事件不会触发。这是一个错误吗?什么错误?浏览器? jQuery的? CSS?这对我来说根本没有意义,我很乐意看到解释!

感谢。

4 个答案:

答案 0 :(得分:4)

由于li的浮动且表单有position:relative,因此表单位于li的上方,因此您仍然可以点击“图片”

顺便说一句: 如果您使用的是Firebug或Webdeveloper工具,则可以检测到它。

答案 1 :(得分:1)

如果您使用firebug或类似的东西检查您的DOM,您会注意到您的表单浮动在ul的第一个元素上,因此它在“image”上工作,因为它不会被您的表单隐藏。 尝试在jsFiddle中清空你的css代码,一切都按预期工作。

答案 2 :(得分:0)

点击功能不起作用的原因是 li 元素未放置在表单

答案 3 :(得分:0)

我为你创造了一个小提琴,请看一下click action working fine on all elements