Open Bootstrap Dropdown, wenn die ENTER-Taste in Eingabe gedrückt wird

Question

Ich möchte ein Bootstrap Dropdown öffnen, wenn die EINGABETASTE innerhalb einer Eingabe gedrückt wird.

HTML:

<div class="top dropdown" id="search-bar"> 
    <span class="fa fa-search" id="search" data-toggle="dropdown"></span>     

    <input type="text" id="search" class="form-control" placeholder="Search" data-toggle="dropdown"/> 

    <ul class="dropdown-menu"> 
    <li> Something </li>     
    </ul> 
</div> <!--search bar --> 

JS:

$('input#search').keypress(function(e) { 
    if(e.keyCode == 13) { 
    $('input#search').dropdown(); 
    } 
}); 

Das Problem ist, dass data-toggle="dropdown" das Drop-down auslöst, wenn ich gerade innerhalb der Eingabe klicken. Ich möchte es nur bei ENTER auslösen.

Answer 1

Ich habe Probleme mit Ihrem Code gefunden.

• Es ist falsch id Zuordnung wird Suche als ID für beide Spanne Symbol und für den Eingang.

• Die Dropdown-Liste wird aufgrund des zugewiesenen
  data-toggle = dropdown-Attributs am Eingang ausgelöst.

Basierend auf den erwähnten Probleme mit Ihrem Code versuchen Sie stattdessen:

<div class="top dropdown" id="search-bar"> 
     <span class="fa fa-search" id="btn-search" data-toggle="dropdown"></span> 

     <input type="text" id="search" class="form-control" autocomplete="off" placeholder="Search" /> 

     <ul class="dropdown-menu"> 
     <li> Something </li> 
     </ul> 
    </div> 
    <!--search bar --> 


     $('input#search').keypress(function(e) { 
     if (e.keyCode == 13) { 
     $('#btn-search').click(); 
     } 
    });