单击功能不适用于 $(document)答案

【问题标题】：Click function is not working on $(document)单击功能不适用于 $(document)
【发布时间】：2016-04-21 07:43:45
【问题描述】：

alert("hi");
$(document).on('click', '.customerstory-section-header', function() {
   $('.overlay-Div').hide();
   $(this).parent().children().children("div.overlay-Div").toggle();
   $("#Jananayak-Stories-Section").hide();
   $("#Customer-Stories-Section").show();
});

click 函数正在处理div。类名选择器在标记和 jQuery 代码中是相同的。如果我在 click 函数之外放置一个alert，它正在工作，警报即将到来。如果我在 click 函数中放置警报，它就不起作用。 console 不在那里工作。有人可以帮帮我吗？

$(".customerstory-section-header").hover(function(){
  alert("hi");
   $('.overlay-Div').hide();
   $(this).parent().children().children("div.overlay-Div").toggle();
   $("#Jananayak-Stories-Section").hide();
   $("#Customer-Stories-Section").show();
});

我更改了事件悬停并尝试了。它不工作。如果我把警报放在功能之外，警报就来了。所以JS文件正在加载。但是没有一个事件处理程序不起作用。请在这里帮助我

【问题讨论】：

您的 jQuery 添加是否正确且正常工作？
请添加您的html 并改进您的问题
检查你的浏览器控制台，看看是否有任何错误......也分享你的html
我们需要查看您的 HTML 以便能够为您提供帮助。假设您的 HTML 处于正确的状态，您所显示的内容没有理由不起作用。
.customerstory-section-header 和 document 之间的点击事件传播可能以某种方式停止

标签： jquery events event-handling

【解决方案1】：

你可能需要这个：

$(function() {
  $( "body" ).click(function() {
    alert( "Body Clicked" );
  });
});

演示： http://jsfiddle.net/e640ggmy/

【讨论】：

如果它在您的情况下不起作用，那么您的 DOM 将会发生其他一些问题。请按F12 检查您的浏览器控制台并检查您遇到的错误。
好吧，因为他没有发布完整的代码，所以我/你无法弄清楚到底发生了什么。其次，我发布的答案很简单且有效。
但是 OP 的更好恕我直言。更好，因为他不必绑定额外的事件（文档伪就绪），因为document 随时可用，不像body
这是完美的解决方案。它工作得很好...... @hmd 非常感谢

【解决方案2】：

你用的是什么版本的jquery？从 1.7.1 开始支持 .on() 函数，如果您使用的是早期版本，则应改为使用 .bind()、.live() 或 .delegate()

here is the difference between all of them

http://api.jquery.com/on/

您也可以使用浏览器控制台并键入 $(document) 来获取 jquery 对象并展开它以查看它支持的功能。

【讨论】：

【解决方案3】：

试试

$(document.body).on('click', '.customerstory-section-header', function(event) {
   ....
});

【讨论】：

document.body 也有助于动态 html。
@DharaParmar $(document).on('click', '.customerstory-section-header', function() { 将起到同样的作用。
这不是一个答案，而是一个建议。解释为什么 OP 需要使用此代码以及他的代码有什么问题。