Question

我正在生成列在无序列表中的列表项。然后我想听一下这些列表项中的任何一个。我知道我没有发布完整的代码，但我希望我没有必要。我的jQuery点击功能是否完全忽略了这样添加的元素？我已经尝试过几乎所有东西，但却找不到原因！我想看到的只是我的“大声笑”警报！：（

  $.each(entries, function(i, v) {
    s += '<li';
    if (favouriteItem(v.title)) s += ' data-theme="e"';
    s += '><a href="#feedItemPage" class="contentLink" data-transition="slide" data-entryid="'+i+'">' + v.title + '</a></li>';
  });

  $("#linksList").append(s);
  $("#linksList").listview("refresh");

    $("li").click(function() {
      alert("lol");
      selectedEntry = $(this).data("entryid");
    });

尽管项目在视觉上显示，但源代码保持如下：

  <div data-role="content">
      <ul data-role="listview" id="linksList" data-divider-theme="b" data-inset="false"></ul>
  </div>

建议那里没有li元素。他们确实在视觉上表现出来在我跳进熔岩池之前，有人请救救我。

Answer 1

变化：

$("li").click(function() {
  alert("lol");
  selectedEntry = $(this).data("entryid");
});

到

$('#linksList').on('click', 'li',function() {
  alert("lol");
  selectedEntry = $(this).data("entryid");
});

当您向文档动态添加元素时，您需要使用.on()'s委派的事件语法。

事件处理程序仅绑定到当前选定的元素;他们在您的代码调用.on（）时页面上必须存在。要确保元素存在且可以选择，请执行事件绑定在文档就绪处理程序中的元素页面上的HTML标记。如果将新HTML注入页面，选择元素并在新HTML之后附加事件处理程序放入页面。

Answer 2

使用委托：

$("#linksList").on('click',"li",function() {
      alert("lol");
      selectedEntry = $(this).data("entryid");
    });

.click（）函数被忽略

2 个答案: