[英]How to remove options from select element using jquery?
我有n个这样的下拉菜单:
<select id="select1">
<option>1</option>
<option>2</option>
<option>3</option>
</select>
<select id="select2">
<option>1</option>
<option>2</option>
<option>3</option>
</select>
具有相同的选项。 所有选项都应该是唯一的,因此一旦在一个组合框中选择了该选项,就应将其从其他组合中删除。 因此,如果用户在select1中选择“ 1”,则select2中将只有选项“ 2”和“ 3”。
现在, jQuery根据选定的Radio禁用SELECT选项(需要对所有浏览器的支持)提供了一个不错的解决方案,但是如何修改它以使用select而不是单选按钮呢?
你是这个意思吗?
这将从#select1
#select2
中删除所有内容:
$("#select2 option").each(function() {
if($("#select1 option[value=" + this.value + "]").length)
$(this).remove();
});
这是删除所有重复项的另一种选择:
$("select").each(function() {
var select = $(this);
select.children("option").each(function() {
$('select').not(select).children("option[value=" + this.value + "]").remove();
});
});
这将删除所有重复项,仅在找到它的第一个<select>
保留选项。
更新您的评论:
$("#select1").change(function() {
$("#select2 option[value=" + $(this).val()+ "]").remove();
});
或者,如果选择具有相同顺序的相同选项。
$('select').change(function() {
var selectedIndex = $(this).find(':selected').index();
$('select').not(this).find('option:nth-child(' + selectedIndex + ')').remove();
)};
我认为这种方式速度更快(但不易阅读)。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.