Question

当用户选择下拉框中的项目时，是否存在特定事件？我正在创建一个使用多个下拉框的相当大的表单。在加载时，除了第一个选项之外的所有选项都被禁用，因为用户选择了第一个选项，第二个框中的选项会使用AJAX进行更改，并且我想删除该属性。

$('#site_id').on('change', function(event) {
    $('#access_type_id').removeAttr('disabled');
});

我遇到的麻烦是.change()似乎在下拉列表中的选项发生变化时触发，使得在我真正想要它们之前启用了下拉框。是否有替代事件，我可以使用替代更改，只有在用户在上一个下拉列表中进行选择后才“启用”表单字段？

更新

我设法通过完全不使用change事件并将我的removeAttr放入我的AJAX调用的success部分来解决这个问题。一个例子如下。这使得我可以在填充其选项时启用“下一个”下拉列表。

$('#access_speed_id').on('select2-blur', function(event){
    $.ajax({
        async: true,
        data: $('#access_speed_id').serialize(),
        dataType: 'html',
        success: function(data, textStatus) {
            $('#cdr_id').removeAttr('disabled');
            $('#cdr_id').html(data);
        },
        type: 'post',
        url: '/services/specificCdrs'
    });
});

Answer 1

尝试以下代码：

<select id="drop1">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</select>
<select id="drop2"></select>

Jquery的

$(document).ready(function(){
$("#drop2").attr("disabled", true);
$("#drop1").change(function(){
    $("#drop2").attr("disabled", false);
    //Put your ajax code here and bind like below code
    $("#drop2").append(new Option("option text", "value"));
    $("#drop2").append(new Option("xxx","1"));        
});
});

演示：http://jsfiddle.net/J5kmz/

jQuery下拉选择事件

1 个答案: