Javascript Jquery：将几个动态添加的元素绑定到html（）事件

我的页面中有几个下拉列表，它们将使用AJAX动态更新，如下所示：

    $.ajax({
        data: parametros,
        url: 'getList.php',
        type: 'POST',
        success:  function (response) {
          element.html(response);
          }

下拉列表具有以下格式的名称：

<select id="elemento_1" class="dropdowns">
<select id="elemento_2" class="dropdowns">
<select id="elemento_3" class="dropdowns">

它会检查有问题的下拉列表，如果它不是第一个下拉列表，则会获取上一个下拉列表的值并将其加载到当前下拉列表中

现在，这一切都很好……除了在我的测试中，只有在加载第一个下拉列表时才会触发事件（只有在第一个下拉列表中才会出现

警报（“mooo”）

）。如果我按下按钮，会出现第二、第三…下拉列表，但不会触发事件。我怀疑这是因为这里的解释：

（

bind

仅适用于最初存在的元素，而不适用于后来添加的元素）

建议的解决方案是使用

on（）

…但我不知道如何确切地使用它来捕获自定义事件，比如我为

html（）

更改定义的事件。你能做到吗？还有其他解决办法吗

---

谢谢。

“但我不知道如何准确地使用它来捕获自定义事件”-与任何其他事件一样，通过提供事件名称？我只是尝试了一下。使用：

$（“.dropdowns”）。在（“cambia”上，function（）{

而不是

unbind（）.bind

，它不起作用。这不是您使用

的方式。在

上，对于以后只添加到DOM中的元素。请阅读jQuery文档，其中有一个解释和示例。您应该将事件委派与

$（'body'）一起使用。在（'cambia'，'.dropdowns'，function（）{

感谢你们两位。附录：我必须更改我的代码，这样，它就不用使用“triggerHandler”，而是对事件调用

trigger

。有了这个更改，它现在就可以工作了。

    $.ajax({
        data: parametros,
        url: 'getList.php',
        type: 'POST',
        success:  function (response) {
          element.html(response).triggerHandler("cambia");
          }

  $(".dropdowns").unbind().bind("cambia", function() {
      var nombre=this.id;
      var numero=parseInt(nombre.slice(-1));
      alert("Mooooo " + numero);
      if (numero > 1) {
        var anterior = $("#elemento_" + (numero - 1)).val();
        this.find("option[value='" + anterior + "']").prop("selected", "selected").change();
        }
});