Question

我有两个选择框。我需要禁用整个第二个选择框，直到用户选择第一个选择框中第一个选项以外的任何选项。

这是我的逻辑，但我无法执行它。

if 
     .first-select = option-1 
then 
     .second-select .attr('disabled').
else
     .second-select .removeAttr('disabled')

Answer 1

您可以使用selectedIndex属性：

var 
    firstSelect = document.querySelector('.first-select'),
    secondSelect = document.querySelector('.second-select')
;

function changeHandler() {
   secondSelect.disabled = firstSelect.selectedIndex === 0;
}

firstSelect.addEventListener('change', changeHandler);
changeHandler(); // execute the handler once on DOM ready

或者如果您使用的是jQuery：

$('.first-select').on('change', function() {
   $('.second-select').prop('disabled', this.selectedIndex === 0);
}).change(); // trigger the event once on DOM ready

Answer 2

你必须做这样的事情

$("#first_select").on("change",function(){
if(this.selectedIndex != 0){
$("#second_select").removeAttr("disabled"); 
// or you can do this $("#second_select").prop("disabled",false);
});

如果首先选择选项1，则选择禁用

2 个答案: