jQuery从select中删除选项

我有一个有5个选择的页面，都有一个类名“ct”。我需要从每个选择中删除值为“X”的选项，同时运行onclick事件。我的代码是:

$(".ct").each(function() {
$(this).find('X').remove();
});

我哪里说错了?

570116 次浏览
小开
最佳答案

试试这个:

$(".ct option[value='X']").each(function() {
$(this).remove();
});

或者更简洁地说，这也同样有效:

$(".ct option[value='X']").remove();
小开

find()接受选择器，而不是值。这意味着您需要以与使用常规jQuery函数($('selector'))相同的方式使用它。

因此，你需要这样做:

$(this).find('[value="X"]').remove();

参见jQuery 找到文档。

小开 
$('.ct option').each(function() {
if ( $(this).val() == 'X' ) {
$(this).remove();
}
});

或者只是

$('.ct option[value="X"]').remove();

重点是find接受一个选择器字符串，通过给它输入x，你正在寻找名为x的元素。

小开

它工作在选项标签或文本字段:

$("#idname option[value='option1']").remove();
小开

如果你的下拉列表是在一个表中，你没有id，那么你可以使用下面的jquery:

var select_object = purchasing_table.rows[row_index].cells[cell_index].childNodes[1];
$(select_object).find('option[value='+site_name+']').remove();
小开

jquery <1.8您可以使用:

$('#selectedId option').slice(index1,index2).remove()

删除选定选项的特定范围。

小开

当我只是一个删除选项仍然在视图上的ddl，但在html(如果你检查页面)

$("#ddlSelectList option[value='2']").remove(); //removes the option with value = 2
$('#ddlSelectList').val('').trigger('chosen:updated'); //refreshes the drop down list
小开

迭代列表并使用find删除多个项。 响应包含一个整数数组。$('#OneSelectList')是一个选择列表 

$.ajax({
url: "Controller/Action",
type: "GET",
success: function (response) {
// Take out excluded years.
$.each(response, function (j, responseYear) {
$('#OneSelectList').find('[value="' + responseYear + '"]').remove();
});
},
error: function (response) {
console.log("Error");
}
});
小开

如果选项值没有可用的id或类，可以从下拉列表中删除所有值，如下所示

$(this).find('select').find('option[value]').remove();
小开

尝试删除选定的

$('#btn-remove').click(function () {
$('.ct option:selected').each(function () {
$(this).remove();
});
});
小开

在删除option时，我最喜欢做的事情就是根本不删除它。此方法对于那些想要删除option但稍后可能想重新添加它，并确保它以正确的顺序添加回来的人是有益的。

首先，我实际上disable该选项。

$("#mySelect").change(
function() {


$("#mySelect").children('option[value="' + $(this).val() + '"]').prop("disabled", true);


$("#re-addOption").click(
function() {
$("#mySelect").children('option[value="' + howeverYouStoredTheValueHere + '"]').prop("disabled", false);
}
);
}
);

然后清理，在我的CSS中，我将disabled option设置为隐藏，因为隐藏option在某些浏览器中不起作用，但使用上述方法，具有这些浏览器的客户端将无法再次选择该选项。

select option[disabled] {
display: none;
}

就我个人而言，在re-addOption元素上，我有一个自定义属性data-target="value"，并使用$(this).attr('data-target')代替howeverYouStoredTheValueHere。

小开

我尝试了这段代码:

$("#select-list").empty()

小开

删除所有选项

$(".select").empty();

删除所有选项并添加一个空白选项

$(".select").empty().append(new Option('--Select--',''));

提交答案