Javascript 如何在jquery中动态生成事件？

我试图在动态生成的一组下拉列表上设置事件属性，但由于某些原因，这些事件无法工作。 这是我的密码

$(document).ready(function () {
  var idRoomTypesList = $("#idRoomTypesList").attr('value').split("_");
  for (var i = 0; i < idRoomTypesList.length; i++) {
    $("#roomTypeID-" + idRoomTypesList[i] + "_nRentedRooms").attr("onchange", generatePrice);
  }
});

var generatePrice = function () {
  alert(this.value().toString());
}

$（文档）.ready（函数（）{
var idRoomTypesList=$（“#idRoomTypesList”）.attr（'value'）.split（“#”）；
对于（变量i=0；i

HTML：

<select class="dynamicSelects">
 ....
</select>

这是一个使用jQuery提供的

on

方法并委派事件的示例。这意味着，即使这些下拉列表不在DOM中，您仍然可以将事件附加到它，并且只要它们存在于DOM中，事件就会触发。它基本上说是将这些事件附加到主体，但使用类

dynamicSelects

激发元素。这也包括在以后使用此类添加任何其他动态生成的下拉列表

设置属性以附加事件，虽然可能有效，但在我看来，实际上应该使用

on

方法或纯JS中的

addEventListener

来完成

此外，在普通DOM元素上操作时，value属性不是函数，因此不需要

value（）

。只需

这个.value

。您不需要将其转换为字符串，因为value返回字符串。如果它是jquery对象，那么您可以执行

$（this）.val（）

，这是一个函数

---

当然，我之所以建议进行这种更改，是因为如果您打算使用jQuery这样的库，至少要利用它提供的功能。

我认为这对您来说一定很有用

 $(document).ready(function () {
  var idRoomTypesList = $("#idRoomTypesList").attr('value').split("_");
  for (var i = 0; i < idRoomTypesList.length; i++) {
    $("#roomTypeID-" + idRoomTypesList[i] + "_nRentedRooms").on("change", generatePrice);
  }
});    
    var generatePrice = function () {
      alert($(this).val());
    }

$（文档）.ready（函数（）{
var idRoomTypesList=$（“#idRoomTypesList”）.attr（'value'）.split（“#”）；
对于（变量i=0；i

看看这个：

您是否搜索了

$（文档）.ready（函数（）{
var$idRoomTypesList=$（“#idRoomTypesList”）.attr（'value'）.split（“#”）；
对于（变量i=0；i

属性不应该是onchange吗？您是否可以尝试使用

“onchange”

而不是

“change”

而不是

“change”

您不应该使用不引人注目的

on（）

而不是属性？您正在调用的

value（）

方法是什么？您正在将

change

设置为函数引用；这没道理。你试过这个吗$（“#选择器”）.on（'change'，generatePrice）；

 $(document).ready(function () {
  var idRoomTypesList = $("#idRoomTypesList").attr('value').split("_");
  for (var i = 0; i < idRoomTypesList.length; i++) {
    $("#roomTypeID-" + idRoomTypesList[i] + "_nRentedRooms").on("change", generatePrice);
  }
});    
    var generatePrice = function () {
      alert($(this).val());
    }

$(document).ready(function () {
  var $idRoomTypesList = $("#idRoomTypesList").attr('value').split("_");
  for (var i = 0; i < idRoomTypesList.length; i++) {
    $("#roomTypeID-" + idRoomTypesList[i] + "_nRentedRooms").attr("onchange", generatePrice);
  }

    $( "#idRoomTypesList" ).change(generatePrice());

});

var generatePrice = function () {
  alert(this.value().toString());
}