jQuery更改模糊事件仅适用于列表中的第一个元素


jQuery change blur event only working for first element in list

我遇到了一个问题-我的jQuery更改模糊事件只适用于动态创建的列表中的第一个元素。我该如何解决此问题?

我创建的元素(一个淡化的版本)可以在这里找到:http://jsfiddle.net/kfm5b/2/

jQuery

$('.roomFac').on("change blur", function () {
    var park = $("#park2").val();
    var lecturestyle = $("#lecture_style2").val();
    var roomstructure = $("#room_structure2").val();
    var groupsize = $("#groupSize2").val();
    var facilities = "";
    $('select[name*=roomFac]').each(function () {
        facilities += $(this).val();
        facilities += ",";
    });
    var dataString = 'park=' + park + '&' + 'lecturestyle=' + lecturestyle + '&' +
        'roomstructure=' + roomstructure + '&' + 'groupsize=' + groupsize + '&' +
        'facilities=' + facilities;
    $.ajax({
        type: "POST",
        url: "process_timetableMon2.php",
        data: dataString,
        cache: false,
        success: function (html) {
            $('#mon').html(html);
        }
    });
});

process_timetableMon2.php

$array = explode(",", $_POST["facilities"]);
for($i = 0; $i < count($array); $i++){
    echo $array[$i].'<br>';
}

由于select下拉列表是动态添加的,因此需要一个委托的事件处理程序:

$(document).on('change blur', '.roomFac', function () {
    //Your function here
});