jQueryは選択からオプションを削除します


221

5つのselectがあり、すべてにクラス名「ct」があるページがあります。onclickイベントの実行中に、各選択から値「X」のオプションを削除する必要があります。私のコードは:

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

どこがいけないの?


これはうまく機能します: $('select').children('option[value="X"]').remove();
劉鎮瑲

回答:


451

これを試して:

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

より簡潔にするために、これも同様に機能します:

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

1
これでうまくいきました。ありがとう。選択された値= ''でこれを.ctに制限する構文は何ですか?
user135498 2009年

2
これは、値を知る必要がない場合に最も簡単です。たとえば、最初のオプション$( "#affiliate")[0] [0] .remove();を削除します。
ladieu 2014年

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

あるいは単に

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

主なポイントはfind、セレクター文字列を受け取り、それxをフィードすることで、という名前の要素を探しているということxです。


5
+1私はこの答えが好きです。「X」をvaluefor <select>要素のように、またはfor 要素の一部としてテストできるため、より良いと思います
shareef

1
val = 0以外のすべてのオプションを削除する必要があったので、私はこの回答を使用しました。!= 0を使用し、チャームのように機能しました:)
Lakshman Pilaka '19

31

find()値ではなくセレクターを取ります。つまり、通常のjQuery関数($('selector'))を使用するのと同じ方法で使用する必要があります。

したがって、次のようなことを行う必要があります。

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

jQuery find docsを参照してください。


1
変数を追加に渡す場合の方がはるかに良い
Neurothustra

3

オプションタグまたはテキストフィールドのいずれかで機能します。

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

1

ドロップダウンがテーブルにあり、IDがない場合は、次のjqueryを使用できます。

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

1

jquery <1.8の場合、以下を使用できます。

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

選択オプションの特定の範囲を削除します。


1

私が単に削除したとき、オプションはビューのddlに残っていましたが、htmlに表示されていません(ページを調べた場合)

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

1

リストを繰り返し、検索を使用して複数のアイテムを削除します。応答には整数の配列が含まれます。$( '#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");
    }
});
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.