Question

我已将此脚本编写在主文件中。哪个可以在预加载的选项上正确执行。

<select id="version_select">
   for loop.....
   <option value="{{ score_criteria.pk }}" id="id_{{ score_criteria.pk }}">{{ score_criteria }}</option>                   
</select>

$("#version_select").change(function () {
   $(this).val();
}

因此，当我通过单击更改选项时，它将执行更改功能并按我希望的方式工作。

但是，当我在选择内通过ajax附加新选项并想要单击该选项并执行更改功能时，会发生问题。我可以执行更改功能，但无法获取新添加的元素对象，这可能是一种简单的解决方案，但我坚持使用它。我到目前为止更新的代码是：

$(document).on('change','#version_select', function () {
    $(this).val();
}

在ajax成功响应中，我附加了该选项并尝试执行更改功能。

success: function (response) {
  $("#version_select").append(`<option value="${response.id}" id="id_${response.id}">${response.value} 
   </option>`);
  $(document).on('click', `#id_${response.id}`, function () {
     $("#version_select").change();
  });
  $(`#id_${response.id}`).click();
}

这两个更改使更改功能得以执行，但我无法在该更改功能中获取新的选项对象。即在$(this).val();中。我知道$("#version_select").change();只会告诉我我要传递的对象，请建议我正确的方法。这可能是一个非常简单的解决方案，但是如果这个问题重复出现或者似乎不可行，我现在就陷入困境，我会迅速删除它，任何建议都将受到欢迎。

单击并从动态添加的选项jquery加载onchange函数

0 个答案: