如何在回发后保留选定的li菜单

时间:2014-03-10 16:00:17

标签: jquery menu postback selected

我不会说英语,但我的aspx表单上列出了一些控件,如下所示

这是菜单:

<div id='cssmenu'>
            <ul>
               <li class='active'><a href=''><span>Inicio</span></a></li>
               <li class='has-sub'><a href='#'><span>Portafolio</span></a>
                  <ul>
                     <li><asp:LinkButton ID="LinkResum" runat="server" OnClick="Link_SelectedIndexChanged" 
                     Text="&nbsp;&nbsp;&nbsp;&nbsp;■ Resumen" OnClientClick="Cargar()"></asp:LinkButton></li>
                  </ul>
               </li>
               <li><asp:LinkButton ID="LinkReport" runat="server" OnClick="Link_SelectedIndexChangedReport" 
                     Text="Reporte" OnClientClick="Cargar2()"></asp:LinkButton></li>
               <li class=''><a href='#'><span>Formularios</span></a></li>
               <li><asp:LinkButton ID="LinkButton1" runat="server" OnClick="Link_SelectedIndexChangedContacto" 
                     Text="Contacto" OnClientClick="Cargar3()"></asp:LinkButton></li>
               <li class=''><a href="Javascript:__doPostBack('dnn$dnnLOGIN$cmdLogin','')"><span>Cerrar sesion</span></a></li>
            </ul>
         </div>

我的jquery就是这个

这是我的剧本:

<script type="text/javascript">

$(document).ready(function() {
    $('#cssmenu ul ul li:odd').addClass('odd');
    $('#cssmenu ul ul li:even').addClass('even');
    $('#cssmenu > ul > li > a').click(function() {
        $('#cssmenu li').removeClass('active');
        $(this).closest('li').addClass('active');
        var checkElement = $(this).next();
        if ((checkElement.is('ul')) && (checkElement.is(':visible'))) {
            $(this).closest('li').removeClass('active');
            checkElement.slideUp('normal');
        }
        if ((checkElement.is('ul')) && (!checkElement.is(':visible'))) {
            $('#cssmenu ul ul:visible').slideUp('normal');
            checkElement.slideDown('normal');
        }
        if ($(this).closest('li').find('ul').children().length == 0) {
            return true;
        } else {
            return false;
        }
    });
});

我希望在回发后保留所选择的li,我不是很好的jquery程序员......

谢谢。

1 个答案:

答案 0 :(得分:0)

将此文件另存为index.html,然后单击菜单项使用警报功能进行调试

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">


    <head>
        <title>Accordion test</title>
        <script type="text/javascript" src="http://ajax.googleapis.centercodehereom/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
        <script type="text/javascript">
            $(document).ready(function () {

                // initialize accordion
                $('#Accordion ul').each(function () {
                    alert(currentURI);
                    var currentURI = window.location.href;
                    var links = $('a', this);
                    var collapse = true;
                    alert(links.size());
                    for (var i = 0; i < links.size() ; i++) {
                        var elem = links.eq(i);
                        var href = elem.attr('href');
                        var hrefLength = href.length;
                        var compareTo = currentURI.substr(-1 * hrefLength);


                        if (href == compareTo) {
                            alert(href);
                            collapse = false;
                            break;
                        }
                    };
                    if (collapse) {
                        $(this).hide();
                    }
                });

                // on click, show this element and hide all others
                $('#Accordion > li').click(function () {
                    var me = $(this).children('ul');
                    $('#Accordion ul').not(me).slideUp();
                    me.slideDown();
                });
            });
        </script>
</html>
<body>
    <ul id="Accordion">
        <li>
            PEOPLE
            <ul>
                <li><strong>+</strong> <a href="index.html?show=Yousuf&Ali">Yousuf Ali</a></li>
                <li><strong>+</strong> <a href="index.html?show=hanifa">HANIFA</a></li>            
                <li><strong>+</strong> <a href="index.html?show=Mohamed">MOHAMED</a></li>

            </ul>
        </li>
        <li>
            EVENTS
            <ul>
                <li><strong>+</strong> <a  href="index.html?show=Khaja&Mohideen">COMING SOON</a></li>
            </ul>
        </li>
        <li>
            LANDSCAPES
            <ul>
                <li><strong>+</strong> <a  href="index.html?show=Askar&Ali">COMING SOON</a></li>
            </ul>
        </li>
        <li>
            INFO
            <ul>
                <li><strong>+</strong> <a  href="index.html?show=Mohideen&Ali">COMING SOON</a></li>
            </ul>
        </li>
    </ul>
</body>
</html>