Gibt es eine schnellere Möglichkeit, den ausgewählten Wert in einem Dropdown-Menü festzulegen?

Question

Ich habe eine Dropdown-Liste und eine Auswahlliste. Beide enthalten ziemlich viele identische Gegenstände. Grundsätzlich setze ich den ausgewählten Wert des Dropdown-Menüs basierend auf dem Listenelement-Index, auf den geklickt wurde.

-Code hierfür lautet:

$('.dropdown-list li').click(function(){ 
    $('#edit-type option').removeAttr('selected', 'selected'); 
    var listvalue = $(this).index(); 
    $('#edit-type option').eq(listvalue).attr('selected', 'selected'); 
}); 

Das funktioniert aber es ist ziemlich langsam. Es gibt eine Verzögerung von 3/4 Sekunden, bevor die Dropdown-Option ausgewählt wird.

Gibt es einen schnelleren Weg, dies zu tun?

EDIT:

<select id="edit-type" name="type" class="form-select" style="display: none; "> 
<option value="All">- Any -</option> 
<option value="171">item Name 1 </option> 
<option value="172" selected="selected">item Name 2</option> 
</select> 

<ul class="dropdown-list"> 
<li><div><span>item Name 1</span></div></li> 
<li class="selected"><div><span>item Name 2</span></div></li> 
</ul> 

Mein Grund dafür ist, so kann ich einen Stil Dropdown erstellen.

Dank Robert

Answer 1

Sie wahrscheinlich viele Elemente in der Liste, wenn es so langsam ist. Der schnellste Weg, direkt sollte den gewählten Index setzen:

$('.dropdown-list li').click(function(){ 
    var oDDL = $('#edit-type'); 
    if (oDDL.length > 0) 
     oDDL[0].selectedIndex = $(this).index(); 
}); 

Falls Sie wirklich viele Elemente es auch viel besser .on() zu verwenden, die für jedes Listenelement einzelnen Handler hinter den Kulissen statt Handler schaffen:

$('.dropdown-list').on('click', 'li', function() { 
    //... 
}); 

Live test case.

Answer 2

Verwenden val() auf der Auswahlbox anstelle attr auf die Optionen ändern:

$('.dropdown-list li').click(function(){ 
    var listvalue = $(this).index(); 
    $('#edit-type').val(listvalue); 
}); 

Answer 3

Sie sollten val() verwenden; (Ich gehe davon aus, dass Ihre wählen Sie die id=edit-type hat)

$('.dropdown-list li').click(function(){ 
    $('#edit-type').val($(this).index()); 

});