jQuery -禁用以下选项
我正在尝试创建一些下拉菜单，这些下拉菜单的值取决于之前的选择。我正在尝试实现的是，如果前面的一个没有选择值，那么所有下面的选择都将被禁用。
假设有人从第一个、第二个和第三个选项中选择了一个选项-然后从第一个选项中选择了一个空值-我希望下面的所有选项-无论有多少个-再次被禁用。
我已经收集了表单中的所有选择：
var sels = obj.closest('form').find('input[type="select"]');我认为也许我应该获取所选索引的索引，然后禁用所有其他索引，但不太知道如何做到这一点。
下面是表单的结构：
<form action="" method="post">
<select name="option-1" id="option-1">
<option value="">Select one</option>
<option value="1">Option 1</option>
<option value="2">Option 2</option>
</select>
<select name="option-2" id="option-2">
<option value="">----</option>
</select>
<select name="option-3" id="option-3" disabled="disabled">
<option value="">----</option>
</select>
</form>现在-我知道如何启用它们-我只需要知道当用户将其中一个菜单值更改为空白时如何禁用所有相关的菜单值。
回答 3
Stack Overflow用户
发布于 2011-09-23 15:41:54
在jQuery中有一个很棒的函数叫做：nextAll()；
当您编写事件处理程序来选择字段时，如下图所示，您可以使用此函数跳转到所有next select并禁用它们。
$("select").change(function(){
$("select").removeAttr("disabled");
if($(this).val()==0){
$(this).nextAll().attr("disabled","disabled");
}
});你只需要正确地指定你想要影响的select。
Stack Overflow用户
发布于 2011-09-23 15:35:26
给定以下HTML：
<select>
<option value="0">-Choose-</option>
<option value="1">Valid option</option>
</select>
<select>
<option value="0">-Choose-</option>
<option value="1">Valid option</option>
</select>
<!-- As many selects as you like -->下面的jQuery应该可以工作：
var sels = $("select");
sels.not(":first").prop("disabled", true);
sels.change(function() {
if($(this).val() !== "0") {
$(this).next().prop("disabled", false);
}
else {
$(this).nextAll("select").val("0").prop("disabled", true);
}
});您可以在操作here中看到它。它简单地禁用除第一个select之外的所有a，将一个change事件绑定到所有这些a，并在事件处理程序中检查是否选择了有效值。如果是，它将启用下一个select。如果不是，它会禁用它。请注意，.prop要求jQuery版本至少为1.6。如果您必须使用旧版本，则可以安全地使用.attr。
Stack Overflow用户
发布于 2011-09-23 15:34:50
你可以看看jquery插件，它们已经解决了你的问题。有关示例，请参阅此jquery plugin page。
但是，如果您想在选择前一个选项时启用选择，您可能会更好：
在页面加载时(或在您的代码中，取决于您的HTML的created)
- enable方式)，在带有
.change()事件和正确选择器的 select之后使用.change()事件和正确的选择器(取决于您的HTML代码(因此，我们无法提供更多帮助))
https://stackoverflow.com/questions/7525650
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号