0

导航菜单——通过单击另一个链接刷新页面时菜单需要保持打开状态

ul class="menu">
                    <li class="item1"><a href="#">Hardware</a>
                        <ul>
                            <li class="subitem1"><a href="receipt-printer.html">Receipt Printer</a></li>
                            <li class="subitem2"><a href="barcode-scanner.html">Barcode <span class="item-move2">Scanner</span> </a></li>
                            <li class="subitem3"><a href="card-swipes.html">Card Swipes</a></li>
                            <li class="subitem4"><a href="weighscales.html">Weighscales</a></li>
                            <li class="subitem5"><a href="touchscreens.html">Touchscreens</a></li>
                            <li class="subitem6"><a href="label-printer.html">Label Printer</a></li>
                            <li class="subitem7"><a href="customer-display.html">Customer <span class="item-move2"> Display</span></a></li>
                            <li class="subitem8"><a href="wap.html">WAP</a></li>
                        </ul>
                    </li>
                    <li class="item2"><a href="#">Software</a>
                        <ul>
                           <li class="subitem1"><a href="step1/install-ootpik.html">Installing ootpik</a></li>
                            <li class="subitem2"><a href="step1/pref-security.html">Preferences &amp; <span class="item-move2">Security</span></a></li>
                        </ul>
                    </li>
                </ul>

菜单结束 操作手风琴菜单的脚本

<!--initiate accordion-->
<script type="text/javascript">
    $(function() {

        var menu_ul = $('.menu > li > ul'),
               menu_a  = $('.menu > li > a');

             menu_ul.hide();

        menu_a.click(function(e) {
            e.preventDefault();
            if(!$(this).hasClass('active')) {
                menu_a.removeClass('active');
                menu_ul.filter(':visible').slideUp('normal');
                $(this).addClass('active').next().stop(true,true).slideDown('normal');
            } else {
                $(this).removeClass('active');
                $(this).next().stop(true,true).slideUp('normal');
            }

        });

    });
</script>

脚本结束

现在查看手风琴的网站： http ://www.ootpik.info/lauren/ootpik5/receipt-printer.html

4

1 回答 1

1

我建议您根据您当前的网址尝试另一个菜单选择器（因为当您的页面刷新时，您之前无法点击菜单项）。它可能是这样的（对于receipt-printer.html 页面）：

$('.menu > li > ul:not(:has(li > a[href="receipt-printer.html"]))')

它是硬编码的，但我认为它可以为你工作。您可以从中获取的当前页面的值window.location.pathname。例如像这样：

var url = window.location.pathname.split('/')[3] //because on your site you have relative url lauren/ootpik5/receipt-printer.html

但它也是硬编码的，我不确定它是否适用于您网站上的任何网址。

因此，算法的完整示例可能是：

var splittedUrl = window.location.pathname.split('/');
var href = splittedUrl[splittedUrl.length - 1];
var menu_ul = $('.menu > li > ul:not(:has(li > a[href="' + href + '"]))');
munu_ul.hide();
于 2013-06-25T20:47:11.283 回答