单击时未触发列表组的单击事件答案

【问题标题】：click event for list group not triggering when clicked单击时未触发列表组的单击事件
【发布时间】：2015-04-15 00:08:35
【问题描述】：

我是 JQuery 的新手，所以我的语法可能不正确，但是当我从列表中选择某些内容时，我无法触发引导列表组的任何点击事件。我不知道这是否有区别，但列表组位于引导弹出框内。

这两种方法我都试过了。

$('#eventList').on('click', '.list-group-item', function(e) {
  e.preventDefault();
  //code here
});

$(".list-group-item").click(function() {
  // code here
});

<div id="events-popover-head" class="hide">Events</div>
<div id="events-popover-content" class="hide">
  <ul id="eventList" class="list-group">
    <li class="list-group-item">First item</li>
    <li class="list-group-item">Second item</li>
    <li class="list-group-item">Third item</li>
  </ul>
</div>

【问题讨论】：

这段代码对我有用

标签： javascript jquery twitter-bootstrap popover

【解决方案1】：

该代码是正确的并且工作正常。

它不适用于您的情况，因为在您添加侦听器时'#eventList' 不存在。

试试这个

$(document).on('click', '#eventList .list-group-item', function(e) {

【讨论】：

$('body').on 和 $(document).on 有什么区别？
来自这个网站sitepoint.com/jquery-body-on-document-on 它说文档更快，所以我应该使用文档而不是正文吗？
@user1186050 几乎没有区别。是的，选择更快的。我将更新我的答案以实际使用document

【解决方案2】：

您的代码在https://jsfiddle.net/bkf7y6q7/https://jsfiddle.net/bkf7y6q7/ 处工作 100%

您确定在您的 html 文件中包含以下内容吗：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>

【讨论】：

【解决方案3】：

演示：http://jsfiddle.net/du92ucfm/1/

这是有效的，你还有什么要问的吗？能否提供具体的bootstrap.js相关代码

$('#eventList').on('click', '.list-group-item', function(e) {
  console.log('i am clicked 1');
});
$(".list-group-item").click(function() {
 console.log("i am clicked 2");
});

【讨论】：