最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

Javascript Click event not firing when clicking on an element's padding - Stack Overflow

programmeradmin1浏览0评论

Has anyone ever experienced a similar thing? When I click on the middle area of an li element, the click event fires, but when clicking on the padded area towards its edge the event doesn't fire.

I'm binding to click on the element.

Super stumped.

Has anyone ever experienced a similar thing? When I click on the middle area of an li element, the click event fires, but when clicking on the padded area towards its edge the event doesn't fire.

I'm binding to click on the element.

Super stumped.

Share Improve this question edited Jul 25, 2019 at 12:46 Brian Tompsett - 汤莱恩 5,89372 gold badges61 silver badges133 bronze badges asked Feb 22, 2012 at 15:51 Ian Storm TaylorIan Storm Taylor 8,72012 gold badges57 silver badges75 bronze badges 6
  • 3 are you sure it's not margin you are talking about? – jondavidjohn Commented Feb 22, 2012 at 15:52
  • Chrome doesn't do anything weird: jsfiddle/G8uRH. – pimvdb Commented Feb 22, 2012 at 15:53
  • Which browser(s)? Might be by design – Richard H Commented Feb 22, 2012 at 15:53
  • 1 Post your code or a jsFiddle. – j08691 Commented Feb 22, 2012 at 15:54
  • 1 I'm having the same issue, with the same HTML element (li), in Google Chrome 22. Is this a thing? – gnclmorais Commented Oct 19, 2012 at 16:59
 |  Show 1 more ment

3 Answers 3

Reset to default 1

I also saw this happening, but only on iOS. Wrapping with a div didn't work either. After some research I discovered that the YUI delegate listener was not firing on that node's padding (though it did everywhere else on the node). Ultimately, I fixed it by removing that node from the delegate listener entirely and adding a traditional click event listener for just that node. After that, it worked fine!

Not sure if this will help your situation or not.

This is no solution, just a workaround, but wrap the whole content of an li in a wrapper div. Apply your padding to the div and not the li. This solved my issue, but this still seems like a very weird bug to me.

Just had this problem in Chrome, fixed it by adding position: relative; to the element.

发布评论

评论列表(0)

  1. 暂无评论