Question

我正在尝试使用jquery在子元素（在本例中为select）更改时触发事件。

这是我的HTML ：

<div id="addForm" ng-repeat="forme in formes" class="row addForm">
    <div class="col-lg-2 col-md-2 col-sm-3 col-xs-6">
        <select id="geo_{{forme.id}}" ng-model="forme.geo" class="form-control">
            <option value="rectangle">Rectangle</option>
            <option value="triangle">Triangle rectangle</option>
            <option value="cercle">cercle</option>
        </select>
    </div>
</div>

尚未运行的javaScript ：

$(document).ready(function () {
    $(document.body).on("change", "#addForm > select", function () {
        alert(this.value);
    });
});

OR

$(document).ready(function () {
    $(document.body).on("change", ".addForm > select", function () {
        alert(this.value);
    });
});

两种方法都无效

这有什么问题？

Answer 1

这不起作用，因为addForm是class而不是id。

$(document).on("change", ".addForm select", function () {
   alert(this.value);    
});

使用.classSelector代替#id选择器。

此外，我错过了指出另一个错误。也就是说，select不是.addForm的直接子项，而是后代。使用descendant selector代替child selecor。

Jquery儿童元素在变化

1 个答案:

DEMO