我在 Laravel 中有一个可以使用动态表单编辑的模型,但我想防止更改选择框中的所选选项,所以当我打开编辑页面时,我应该能够看到带有所选项目的选择框,但所有其他选项应该被禁用。
也许我可以用 jQuery 选择所有 select
并禁用所有未选择的值??如何做到这一点?
我试过这个:
// disable non selected items
$('select').each(function(){
$('option').each(function() {
if(this.selected) {
this.attr('disabled', true);
}
});
});
但它不起作用,我只需要一点帮助
这是选择框,其他都是一样的:
<select name="car">
<option selected="selected" value="1">Volvo</option>
<option value="2">Saab</option>
<option value="3">Mercedes</option>
<option value="4">Audi</option>
</select>
只是选择了其他值
最佳答案
您的代码有两个问题。
首先:您应该检查选项是否未被选中(!this.selected
)然后禁用它。
第二:this.attr('disabled', true)
在 jQuery 中不起作用。您应该改用 $(this)
。
$('select').each(function(){
$('option').each(function() {
if(!this.selected) {
$(this).attr('disabled', true);
}
});
});
$('select').each(function(){
$('option').each(function() {
if(!this.selected) {
$(this).attr('disabled', true);
}
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select name="car">
<option selected="selected" value="1">Volvo</option>
<option value="2">Saab</option>
<option value="3">Mercedes</option>
<option value="4">Audi</option>
</select>
请注意,您代码中的第一个 .each()
循环是附加的。底层代码就够了。
$('option').each(function() {
!this.selected ? $(this).attr('disabled', true) : "";
});
关于javascript - 如何使用 jQuery 在选择框中禁用未选中的选项?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42532355/