Öffnen eines Bootstrap-Dropdown-Menüs über eine externe Schaltfläche

Question

Ich arbeite an einem Job, bei dem mein Arbeitgeber eine reaktionsschnelle Website mit Bootstrap 3 möchte, aber keine visuelle Änderung auf der vorhandenen Desktop-Website wünschen (offensichtlich nicht ideal, aber außerhalb meiner Kontrolle)).

Momentan arbeite ich an der Navigation. Das Problem, mit dem ich konfrontiert bin, ist, dass ich ein Login-Formular (ein Platzhalter an dieser Stelle) in einem Menü Dropdown in der Navigation untergebracht habe. Auf Mobilgeräten erscheint das Formular im Drop-Down-Menü, aber es gibt einen separaten Icon-Button, der zum fixierten Titelzeile-Titel "Login" hinzugefügt wurde. Dieser befindet sich in der Nähe des Hamburger-Menüs und ist auch bei geschlossener Hauptnavigation sichtbar. Unten ist mein codepen:

http://codepen.io/v_for_vinsanity/pen/YVGZdb

ich für eine Art und Weise bin auf der Suche das Login-Drop-Down-Menü zu öffnen, wenn ich auf die Login-Symbol-Schaltfläche zu erhalten. Hier ist der Code für das Login Dropdown-Menü:

<li class="dropdown login-dropdown"> 
       <a href="#" class="dropdown-toggle login-btn" data-toggle="dropdown" aria-expanded="false">Login <span class="caret"></span></a> 
       <ul role="menu" class="dropdown-menu dropdown-menu-right"> 
       <li> 
      <img src="http://placehold.it/350x300" alt="login-placeholder"> 
       </li> 
       </ul> 
      </li> 

mit JQuery, Ive der Lage gewesen, um den Fokus zu erhalten, um das Login-Dropdown-Menü zu verschieben (die Sie im codepen sehen werden), aber ich havent in der Lage gewesen zu Fügen Sie die Klasse "Öffnen" zum li class = "Drop-down-Login-Dropdown" hinzu und/oder ändern Sie das Attribut "aria-expanded" im Anmelde-Tag "Login" in "true". Ive versucht, eine Reihe verschiedener Ansätze, aber unterhalb Sie finden, was ich derzeit haben:

$(function(){ 
    $('.login-icon-btn').click(function(){ 
     $('.nav li.login-dropdown a').trigger('click'); 
     $('.nav li.login-dropdown').addClass('open'); 
     $('.login-btn').attr("aria-expanded","true"); 
    }); 
}); 

Jede mögliche Hilfe bei diesem geschätzt sehr!

Answer 1

, dass eine Option

$(function(){ 
     $('.login-icon-btn').click(function(){ 
      $('.navbar-toggle').click(); 
      $('.login-btn').click(); 
      return false; 
     }); 
    });