Selezione elementi nel menù in base ad una select

[lorenzo84]

Ciao a tutti. Non so se si può fare e conoscendo poco jquery ho delle difficoltà. Io ho un menù molto lungo e volevo creare uno script in jquery che mi consentisse la scelta di elementi tramite una select. Ad esempio nel menù ho due sezioni: Utenti e Pagine e tramite la select posso visualizzare solo le funzioni del menù degli utenti. Si può fare?

Grazie

 

[criric]

Ciao, se non ho capito male puoi provare cosi

<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<script type="text/javascript">
    $(document).ready(function(){
        $("#pagine").hide();
        $("select[name='menu']").change(function(){
            $("ul").hide();
            $("#" + $(this).val()).show();
        })
    })
</script>
<select name="menu">
    <option value="utenti">utenti</option>
    <option value="pagine">pagine</option>
</select>
<ul id="utenti">
    <li>UTENTI</li>
    <li>menu</li>
    <li>menu</li>
    <li>menu</li>
    <li>menu</li>
</ul>
<ul id="pagine">
    <li>PAGINE</li>
    <li>menu</li>
    <li>menu</li>
    <li>menu</li>
    <li>menu</li>
    <li>menu</li>
</ul>

altrimenti un menu espandibile è sempre una buona soluzione

<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<script>
    $(document).ready(function(){
        $("#lista li ul").hide();
        $("#lista li a").not($("#lista li ul li a")).click(function(){
            $("#lista li ul").slideUp();
            var href = $(this).attr('href');
            if($(href).css('display') == 'none')
                $(href).slideDown();
            return false;
        })
    })
</script> 
<ul id="lista">
    <li>
        <a href="#colori"> Colori </a>
        <ul id="colori">
            <li><a href="#">Giallo</a></li>
            <li><a href="#">Rosso</a></li>
            <li><a href="#">Verde</a></li>
            <li><a href="#">Blu</a></li>
        </ul>
    </li>
    <li>
        <a href="#animali">Animali</a>
        <ul id="animali">
            <li><a href="#">Gatto</a></li>
            <li><a href="#">Cane</a></li>
            <li><a href="#">Topo</a></li>
        </ul>
    </li>
    <li>
        <a href="#frutta">Frutta</a>
        <ul id="frutta">
            <li><a href="#">Mela</a></li>
            <li><a href="#">Pera</a></li>
            <li><a href="#">Arancia</a></li>
            <li><a href="#">Uva</a></li>
        </ul>
    </li>
</ul>