2013-07-08 2 views
1

J'ai une baisse vers le bas que je trouve ici: http://tympanus.net/codrops/2012/10/04/custom-drop-down-list-styling/Changer le comportement de sélection jQuery déroulant lorsque vous cliquez dessus

HTML:

<ul class="dropdown" tabindex="1"> 
    <li><a href="/user/profile">profile</a></li> 
    <li><a href="/user/logout">log out</a></li> 
</ul> 

À ce stade des js:

function DropDown(el) { 
      this.dd = el; 
      this.placeholder = this.dd.children('span'); 
      this.opts = this.dd.find('ul.dropdown > li'); 
      this.val = ''; 
      this.index = -1; 
      this.initEvents(); 
     } 

     DropDown.prototype = { 
      initEvents : function() { 
       var obj = this; 

       obj.dd.on('click', function(event){ 
        $(this).toggleClass('active'); 
        return false; 
       }); 

       obj.opts.on('click',function(){ 
        var opt = $(this); 
        obj.val = opt.text(); 
        obj.index = opt.index(); 
        obj.placeholder.text('profile: ' + obj.val); 
       }); 
      }, 
      getValue : function() { 
       return this.val; 
      }, 
      getIndex : function() { 
       return this.index; 
      } 
     } 

     $(function() { 

      var dd = new DropDown($('#dd')); 

      $(document).click(function() { 
       // all dropdowns 
       $('.wrapper-dropdown-1').removeClass('active'); 
      }); 

     }); 

Lorsque les éléments de liste déroulante sont sélectionnés, le texte est placé dans la sélection parent ul au lieu d'aller à la page que je voudrais. Tout fonctionne bien avec cette simple liste déroulante J'ai juste besoin de désactiver la partie qui remplace le lien avec le texte sélectionné. Je veux juste que les balises d'ancrage fonctionnent normalement comme n'importe qui.

msg d'erreur:

try 
84  { 
85   if (! class_exists($prefix.$controller)) 
86   { 
87    throw new HTTP_Exception_404('The requested URL :uri was not  found on this server.', 
88              array(':uri' => $request->uri())); 
89   } 
90 
91   // Load the controller using reflection 
92   $class = new ReflectionClass($prefix.$controller); 

Répondre

0

cette partie il suffit de remplacer cette ...

obj.opts.on('click',function(){ 
       var opt = $(this); 
       obj.val = opt.text(); 
       window.location.href=opt.data('link'); 
      }); 

Et donner à tous vos li's un attribut de données avec le href/lien où il va ...

soit

 <li data="http://newpage.html">New Page</li> 

À moins que vos li éléments ont un élément <a> l'intérieur d'eux, alors vous pouvez probablement faire quelque chose comme ça ...

obj.opts.on('click',function(){ 
       var opt = $(this); 
       link = opt.closest('a').attr('href'); 
       window.location.href=link; 
      }); 
+0

Cela a presque fonctionné. Sauf que je reçois une erreur PHP et avec un message "Undefined". J'ai mis à jour le post avec le HTML. – user2501654

+0

Permet de voir vos éléments HTML li si – KyleK

+0

J'ai ajouté mon HTML à la publication originale. Merci de votre aide. – user2501654

Questions connexes