wake-up-neo.com

So entfernen Sie alle Optionen mithilfe von jQuery/JavaScript aus einer Dropdown-Liste

Ich habe ein Dropdown-Menü wie folgt:

<select id="models" onchange="removeElements()">
            <option id = "remove" value="0">R8</option>
            <option id = "remove" value="1">Quattro</option>
            <option id = "remove" value="2">A6 hatchback</option>
</select>

Wie würde ich das Skript removeElements() erstellen, das alle Optionen in select auswählt?

javascriptjqueryhtmlselect
17
TotalNewbie

Sie haben nicht gesagt, bei welchem ​​Event. Verwenden Sie unten Ihren Event-Listener. Oder verwenden Sie das Laden Ihrer Seite

$('#models').empty()

Dann wieder aufzufüllen

$.getJSON('@Url.Action("YourAction","YourController")',function(data){
 var dropdown=$('#models');
dropdown.empty();  
$.each(data, function (index, item) {
    dropdown.append(
        $('<option>', {
            value: item.valueField,
            text: item.DisplayField
        }, '</option>'))
      }
     )});
56
Mir Gulam Sarwar

Sie können entweder .remove () für Optionselemente verwenden:

.remove (): Entfernen Sie den Satz übereinstimmender Elemente aus dem DOM.

 $('#models option').remove(); or $('#models').remove('option');

oder benutzen Sie .empty () on select:

.empty (): Entfernen Sie alle untergeordneten Knoten des Satzes übereinstimmender Elemente aus dem DOM.

 $('#models').empty();

um jedoch gelöschte Optionen erneut aufzufüllen, müssen Sie die Option beim Löschen speichern.

Dasselbe können Sie auch mit show/hide erreichen:

$("#models option").hide();

und später um sie zu zeigen:

$("#models option").show();
11
Milind Anantwar

Falls .empty () für Sie nicht funktioniert, was für mich ist

function SetDropDownToEmpty() 
{           
$('#dropdown').find('option').remove().end().append('<option value="0"></option>');
$("#dropdown").trigger("liszt:updated");          
}

$(document).ready(
SetDropDownToEmpty() ;
)
0
Jesse
function removeElements(){
  $('#models').html('');
}
0
Deepak Tiwari

Versuche dies

function removeElements(){
    $('#models').html("");
}
0
Dhambha

Jeder, der JavaScript verwendet (im Gegensatz zu JQuery), könnte diese Lösung ausprobieren, wobei "Modelle" die ID des Auswahlfelds ist, das die Liste enthält: -

var DDlist = document.getElementById("models");
while(DDlist.length>0){DDlist.remove(0);}
0
user3506285