列表项单击事件不起作用，但在jsfiddle中

Question

我有这个fiddle，效果很好。因此，当我单击菜单中的列表项之一时，会收到一条警报，告诉我单击了哪个项目。

但是，在我的实际应用程序中，当我单击列表项时，什么都没有发生，对我来说，它看起来完全一样吗？

---

setParallelism

// get list of strategies
var $regions = $('#regionList');

$.ajax({
  type: 'GET',
  url: 'api/Region',
  dataType: 'json',
  success: function(codes) {
    $.each(codes, function(i, code) {
      $regions.append('<li id="' + code + '">' + code + '</li>');
    });
  },
  error: function() {
    alert("Error loading data! Please try again");
  }
});

$("#regionList li").click(function() {
  alert('Clicked ' + this.id);
});

Answer 1

Li元素是动态创建的。因此，您附加监听器的方式不适用于他们。 通过以下方式附加您的听众。它会起作用。

$(document).on('click',"#regionList li",function () {
    alert('Clicked ' + this.id);
});

Answer 2

我会在ajax调用成功后绑定click事件，否则您无法确定li是否存在