Question

以下代码执行以下操作。用户从下拉列表中选择SVN分支。这将加载另一个页面，其中相关模块位于另一个下拉列表中它工作正常，当第二个下拉列表（Continue）未被选中时，module_name按钮被禁用。但是，如果我返回并从第一个下拉列表中选择一个不同的分支，Continue按钮处于活动状态，我需要将其重置为禁用。

HTML代码

<select name="branch_name" id="branch_name">
    <option value="">-- Select a branch --</option>
<?php
    foreach($results as $k) {
        echo "<option value='{$k}'>{$k}</option>";
    }
?>
</select>

<select name="module_name" id="module_name">
    <option value="">-- Select a module --</option>
<?php
    foreach($results as $k) {
        echo "<option value='{$k}'>{$k}</option>";
    }
?>
</select>

JS代码

$(document).on('change', '#module_name', function(){
    $('#continue').prop('disabled', $('#module_name option:selected').length == '');
});

$('#branch_name').on("change", function() {
    $('#output').load('/tags/module',{branch_name: $(this).val()});
});

适用的新JS代码

$(document).on('change', '#module_name', function(){
    $('#continue').prop('disabled', $(this).val() =='');
});

$('#branch_name').on("change", function() {
    $("#continue").attr("disabled", "disabled");
    $('#output').load('/tags/module',{branch_name: $(this).val()});
});

Answer 1

length是一个数字，您的测试是检查选择中是否有option，因此它不会等于''

    /* checks how many eleemnts match selector, will return "0" if none exist*/
    $('#module_name option:selected').length

使用val()查看select是否具有值

$(document).on('change', '#module_name', function(){
    $('#continue').prop('disabled', $(this).val() =='');
});

如何在下拉列表更改时禁用按钮？

1 个答案: