jquery - 填充 jquery 选择框并更新下拉列表

Question

我正在使用以下代码来填充选择框的选项。

function generateTerms(x){
    var optList = new Array(1,2,3,4,5,6,7,8,9,10,11,12,0);
    $.each(optList, function(i, value) {
        if(value==0){var text='Continuous';}
        else if(value==1){var text=x;}
        else{var text=x+'s';}
        $('#term').append($('<option>', { 'value': value, 'text' : text }));        
    });
    $("#term").trigger("liszt:updated");
}

使用这个将是generateTerms('Year');

我的问题是，如果您观看代码，它会正确更新选择框生成，但不会更新 jquery 显示系统。我以为.trigger("liszt:updated");会这样做，但由于某种原因它不会。我正在寻找正确的功能来运行。

Answer 1

liszt:updated是一个自定义事件，触发/绑定它非常简单。这是一个演示：

http://jsfiddle.net/8BhAV/

var $term = $('#term'),
    $log = $('#log'),
    $button = $('button');

$term.on('liszt:updated', function (event) {
    $log.html($log.html() + 'Updated at ' + (+new Date()) + '<br>');
});

$button.on('click', function (event) {
    $term.append($('<option>', {
        value: (+new Date()),
        text: (+new Date())
    }));
    $term.trigger('liszt:updated');
});

我的猜测是您没有绑定 ( $('#term').on('liszt:updated')) 到您正在使用的自定义事件。