"更改“;添加要选择的选项时正在激发

"Change" is being fired when adding options to select

本文关键字：选项 选择 更改 quot 添加      更新时间：2023-09-26

我有两个选择，当第一个改变时，我会重新创建第二个，如下所示：

    _selectSubcategory : function (parent_id) {
        this.id('cat_select').find('option').remove().end();
        var option_list = [];
        option_list.push('<option selected value="0"></option>');
        $.each(this._data.categories, function (k, cat) {
            if (cat.parent_id == parent_id) {
                option_list.push('<option value="' + cat.cat_id + '">' + cat.cat_name + '</option>');
            }
        }.bind(this));
        this.id('cat_select').append(option_list.join(''n'));
}

我有一个关于这个选择的"change"事件的事件监听器。

问题是每次调用_selectSubcategory时都会触发此事件。我该如何修复它？

正如注释中所指出的，除非删除当前所选的元素，否则它应该可以正常工作。

您可以在重新填充列表时添加一个条件来豁免option[selected]，也可以在操作整个<select>时期望它激发一个更改事件。

您可以使用.one和.stopPropagation来忽略通过重新加载列表而触发的更改。类似于：

var $select = $('#options');
$('#add').click(function(e){
    var val = Math.floor(Math.random() * 1000),
        opt = 'option ' + val;
    $('<option>',{'value':'val','html':opt}).appendTo($select);
});
$('#reset').click(function(e){
    $select.one(function(e){
        e.stopPropagation();
    });
    var newopts = {
        '0': 'Please select one...',
        '1': 'Option 1',
        '2': 'Option 2',
        '3': 'Option 3'
    };
    var $lastOpt = $select.find('option').last(),
        newValue;
    // add the new options first
    $.each(newopts, function(v,k){
        if (!newValue) newValue = v;
        $('<option>',{'value':v,'html':k}).appendTo($select);
    });
    // change index once (.one will catch and suppress the change event)
    $select.val(newValue);
    // remove previous elements
    $lastOpt.add($lastOpt.prevAll()).remove();
});
$('#options').change(function(e){
    $('#debug').append('Change detected.'n');
});

更新示例：http://jsfiddle.net/pUyZ7/1/

相关文章：