绑定相同类型的多个事件？

Question

首先,有可能吗？几个小时一直在努力奋斗这个; 我认为我的事件没有解雇的原因是因为一个事件解除绑定/覆盖另一个事件.我想将两个change事件绑定到同一个元素.我怎样才能做到这一点？

---

根据要求,这是我正在努力的功能:

(function($) {
    $.fn.cascade = function(name, trigger, url) {
    var cache = {};
    var queue = {};

        this.each(function() {
            var $input = $(this);
            var $trigger = $input.closest('tr').prev('tr').find(trigger);

            //$input.hide();

            var addOptions = function($select, options) {
                $select.append('<option value="">- Select -</option>');
                for(var i in options) {
                    $select.append('<option value="{0}">{1}</option>'.format(options[i][0], options[i][1]));
                }
                $select.val($input.val()).trigger('change');
            }

            var $select = $('<select>')
                // copy classes
                .attr('class', $input.attr('class'))
                // update hidden input
                .bind('change', function() {
                    $input.val($(this).val());
                })
                // save data for chaining
                .data('name', name)
                .data('trigger', $trigger);

            $input.after($select);

            $trigger.bind('change', function() {
                var value = $(this).val();

                $select.empty();

                if(value == '' || value == null) {
                    $select.trigger('change');
                    return;
                }

                // TODO: cache should be a jagged multi-dimensional array for nested triggers
                if(value in cache) {
                    addOptions($select, cache[value]);
                } else if(value in queue) {
                    $select.addClass('loading');
                    queue[value].push($select);
                } else {
                    var getDict = {}
                    getDict[name] = value;
                    // TODO: use recursion to chain up more than one level of triggers
                    if($(this).data('trigger')) {
                        getDict[$(this).data('name')] = $(this).data('trigger').val();
                    }
                    $select.addClass('loading');
                    queue[value] = [$select];
                    $.getJSON(url, getDict, function(options) {
                        cache[value] = options;
                        while(queue[value].length > 0) {
                            var $select = queue[value].pop();
                            $select.removeClass('loading');
                            addOptions($select, options);
                        }
                    });
                }
            }).trigger('change');
        });

        return this;
    }
})(jQuery);

HTML的相关部分甚至更长......但实质上它是一个带有一堆年份的选择框,然后一个<input>(明显地)替换为<select>显示该车辆为那一年制造的,然后另一个<input>被替换为该品牌/年份的模型.

实际上,除了页面加载外,它现在似乎运行得很好.初始值正在消失.

---

通过拉出那个$select.bind()位并使其生效解决了这个问题:

$('select.province').live('change', function() { 
    $(this).siblings('input.province').val($(this).val()); 
});
$('select.make').live('change', function() { 
    $(this).siblings('input.make').val($(this).val()); 
});
$('select.model').live('change', function() { 
    $(this).siblings('input.model').val($(this).val()); 
});

尽管如此,对于我的个案来说,它很难编码.理想情况下,我想在该函数中封装所有逻辑.所以我可以拥有

$('input.province').cascade('country', 'select.country', '/get-provinces.json');
$('input.make').cascade('year', 'select.year', '/get-makes.json');
$('input.model').cascade('make', 'select.make', '/get-models.json');

Answer 1

是的,这是可能的.

$(…).change(function () { /* fn1 */ })
    .change(function () { /* fn2 */ });

jQuery事件绑定是附加的,.change第二次调用不会删除原始事件处理程序.