List how to choose a dropdown with jQuery?

You are welcome,

I want to simulate a dropdown, but there will only be links, without a form. The problem is how to choose the selected and visible category or subcategory in which you are now?

<ul><li>Category
   <ul>
     <li>Subcategory1</li>
     <li>Subcategory2</li>
   </ul>
</li></ul>

So, when you are in a category, the name of the category will be visible, and this is easy because its first LI, but when you are in a subcategory, the name of the subcategory will be “selected” and visible.

If you have another solution, then list, offer me.

Sorry for my English, I do not know how best to explain :)

+5
source share
4 answers

, , div. , ( ?).

, , div:

<div id="current_page">Default Value</div>
<div id="current_menu">
  <ul>
    <li><a href="page1.html">Page 1</a></li>
    <li><a href="page2.html">Page 2</a></li>
  </ul>
</div>

jQuery :

$("#current_page").click(function(){
  $("#current_menu").slideToggle();
});

$("#current_menu a").click(function(event){
  event.preventDefault(); //prevent synchronous loading
  $("#current_page").html($(this).text());
});
+2
0

li, :

<div id="div1">
    <ul>
    <li>Category
        <ul>
            <li><a href="abc">Subcategory1</a></li>
            <li><a href="xyz">Subcategory2</a></li>
        </ul>
    </li>
    </ul>
</div>

javascript:

var loc = window.location;
$("#div1 li").each( function(){
    var a = $("a", this).attr("href");
    if(a == loc){
        $(this).addClass("hilight");
    } else {
        $(this).removeClass("hilight");
    }
});
0

All Articles