jquery - .trigger ("change") 无法在 .on ("change") 中工作

Question

我使用了 .on("change") 事件函数，因为我的整个代码中有一部分是动态变化的。 .trigger("change") 在 .change() 中工作正常，但在 .on("change") 中不行。这是我的代码:

    $('#popupContent').on('change', '#gradeYearLevel', function() {
        var $course = $('#course');
        var $section = $('#section');

        if ($(this).val() > 4) {
            $type = 0;
        }
        else {
            $type = 1;
        }
        if ($('#gradeYearLevel').val() == '') {
            $course.empty().append($("<option>", {"value": ""}).html("-- Select --"));
            $section.empty().append($("<option>", {"value": ""}).html("-- Select --"));
        }
        else {
            $.getJSON(BASE_PATH + "getJSONCoursesByType/" + $type, function(data) {
                $course.empty().append($("<option>", {"value": ""}).html("-- Select --"));
                $.each(data, function(k,v){
                    $course.append(
                        $("<option>", {"value": v.id}).html(v.title)
                    );
                });
            });
            $.getJSON(BASE_PATH + "getJSONSectionsByType/" + $type, function(data) {
                $section.empty().append($("<option>", {"value": ""}).html("-- Select --"));
                $.each(data, function(k,v){
                    $section.append(
                        $("<option>", {"value": v.id}).html(v.name)
                    );
                });
            });
        }
    }).trigger("change");

Answer 1

问题是因为您触发了从 on() 返回的 #popupContent 元素上的 change 事件，不是委托(delegate)事件处理程序正在监听的#gradeYearLevel。

您需要在子元素上调用trigger()，以便事件可以冒泡。试试这个:

$('#popupContent').on('change', '#gradeYearLevel', function() {
    // your code here...
})

$('#gradeYearLevel').trigger("change");