Question

我有6个选择标签。

FIRST：选择值= 2,3,4,5秒和＆amp;第三：选择   没有属性'禁用'
FORTH，FIFTH，SIXTH：select has属性   '禁用'

我需要：

如果选择值== 3 - ＆gt; FORTH删除属性'禁用'如果选择 value == 4 - ＆gt; FORTH＆amp;如果选择，则删除属性'禁用' value == 5 - ＆gt; FORTH＆amp;第五和第五第六个删除属性'禁用'和否则选择值== 2 - ＆gt; FORTH，FIFTH，SIXTH：添加属性'禁用'

这是我的剧本

<select id="FIRST">
  <option value="1">One</option>
  <option value="2">Two</option>
  <option value="3">Three</option>
  <option value="4">Four</option>
  <option value="5">Five</option>
</select>

<select id="SECOND">
  <option value=" ">Something</option>
  <option value=" ">Something</option>
  <option value=" ">Something</option>
  <option value=" ">Something</option>
  <option value=" ">Something</option>
</select>

<select id="THIRST">
  <option value=" ">Something</option>
  <option value=" ">Something</option>
  <option value=" ">Something</option>
  <option value=" ">Something</option>
  <option value=" ">Something</option>
</select>

<select id="FORTH" disabled>
  <option value=" ">Something</option>
  <option value=" ">Something</option>
  <option value=" ">Something</option>
  <option value=" ">Something</option>
  <option value=" ">Something</option>
</select>

<select id="SIXTH" disabled>
  <option value=" ">Something</option>
  <option value=" ">Something</option>
  <option value=" ">Something</option>
  <option value=" ">Something</option>
  <option value=" ">Something</option>
</select>

<select id="FIFTH" disabled>
  <option value=" ">Something</option>
  <option value=" ">Something</option>
  <option value=" ">Something</option>
  <option value=" ">Something</option>
  <option value=" ">Something</option>
</select>


<script>
$(document).ready(function(){
    $('#FIRST').change(function(event) {
    if ($(this).val() == 3) {
        $('#FORTH').removeAttr('disabled');
    }
    else if $(this).val() == 4) {
        $('#FORTH, #FIFTH').removeAttr('disabled');
    }
    else if ($(this).val() == 5) {
        $('#FORTH, #FIFTH, #SIXTH').removeAttr('disabled');
    }
    else {
        $('#FORTH, #FIFTH, #SIXTH').attr('disabled');
    };
        });
});
 </script>

这是对的吗？那不会运行

Answer 1

如前所述，您有2个语法错误，一个在第一个else if上，另一个在第二个到最后一行，您错过了一个结束括号)

虽然这不是你要问的，但这是一个很好的例子，说明何时使用开关盒来避免丑陋，无效的代码，请看下面的例子：

$('#FIRST').change(function (event) {
    switch (+$(this).val())
    {
        case 3: $('#FORTH').prop('disabled', false); break;
        case 4: $('#FORTH, #FIFTH').prop('disabled', false); break;
        case 5: $('#FORTH, #FIFTH, #SIXTH').prop('disabled', false); break;
        default: $('#FORTH, #FIFTH, #SIXTH').prop('disabled', true); break;
    }
});

编辑 - 你的标记有一个令人困惑的订购问题，其中第六和第五周错误的方式，我修复了这个（并将THIRST重命名为THIRD）你可以看到上面代码的工作演示与修改此JSFiddle

中的标记

为了实现Derek Henderson的评论中描述的内容，上面的代码可以更新为：

$('#FIRST').change(function (event) {
    switch (+$(this).val())
    {
        case 3: $('#FORTH').prop('disabled', false); $('#FIFTH, #SIXTH').prop('disabled', true); break;
        case 4: $('#FORTH, #FIFTH').prop('disabled', false); $('#SIXTH').prop('disabled', true); break;
        case 5: $('#FORTH, #FIFTH, #SIXTH').prop('disabled', false); break;
        default: $('#FORTH, #FIFTH, #SIXTH').prop('disabled', true); break;
    }
});

这是一个关于JSFiddle工作的例子。

Answer 2

您的代码中存在2个语法错误，关闭})处理程序时缺少change，(语句之一缺少else if。

$(document).ready(function(){
    $('#FIRST').change(function(event) {
       if ($(this).val() == 3) {
           $('#FORTH').prop('disabled', false);
       }
       else if ($(this).val() == 4) { // here
           $('#FORTH, #FIFTH').prop('disabled', false);
       }
       else if ($(this).val() == 5) {
           $('#FORTH, #FIFTH, #SIXTH').prop('disabled', false);
       }
       else {
           $('#FORTH, #FIFTH, #SIXTH').prop('disabled', true);
       }
   }) // and here
});

Answer 3

你错过了一个（。改变：

 else if $(this).val() == 4) {
    $('#FORTH, #FIFTH').prop('disabled', false);
}

到

 else if ($(this).val() == 4) {
    $('#FORTH, #FIFTH').prop('disabled', false);
}

选择标记.change - ＆gt; if value == 3 - ＆gt;删除另一个选择的attr'disabled'

3 个答案: