繁体   English   中英

ApyCom JavaScript jQuery菜单-如何显示当前选择的导航元素?

[英]ApyCom JavaScript jQuery menu - how to show the currently selected navigation element?

我正在使用ApyCom的jQuery导航菜单。 它工作正常,除了当我单击其他导航元素时,我希望该导航元素保持突出显示状态以告诉用户他们正在访问哪个页面。 奇怪的是,如果我将实际页面(例如,Contact.aspx)中的href值替换为# ,则所选元素保持突出显示(当然,我无法导航到Contact.aspx,因为它只有一个# )。 只有当我用实际页面替换#时,才发生这种时髦。 这是Default.aspx页面的屏幕截图:

在此处输入图片说明

现在,这是Contact.aspx页面的图片(与我们联系):

在此处输入图片说明

请注意,“主页”仍然突出显示。 这是我的Contact.aspx页面菜单标记:

            <div id="menu">
                <ul class="menu">
                    <li><a href="Default.aspx" class="parent"><span>Home</span></a>
                    </li>
                    <li><a href="#" class="parent"><span>Services</span></a>
                        <div>
                            <ul>
                                <li><a href="#" class="parent"><span>Sub Item 1</span></a>
                                    <div>
                                        <ul>
                                            <li><a href="#"><span>Sub Item 1.1</span></a></li>
                                            <li><a href="#"><span>Sub Item 1.2</span></a></li>
                                        </ul>
                                    </div>
                                </li>
                                <li><a href="#" class="parent"><span>Sub Item 2</span></a>
                                    <div>
                                        <ul>
                                            <li><a href="#"><span>Sub Item 2.1</span></a></li>
                                            <li><a href="#"><span>Sub Item 2.2</span></a></li>
                                        </ul>
                                    </div>
                                </li>
                                <li><a href="#"><span>Sub Item 3</span></a></li>
                                <li><a href="#"><span>Sub Item 4</span></a></li>
                                <li><a href="#"><span>Sub Item 5</span></a></li>
                                <li><a href="#"><span>Sub Item 6</span></a></li>
                                <li><a href="#"><span>Sub Item 7</span></a></li>
                            </ul>
                        </div>
                    </li>
                    <li><a href="About.aspx"><span>About Us</span></a></li>
                    <li class="last"><a href="Contact.aspx"><span>Contact Us</span></a></li>
                </ul>
            </div>

我在这里想念什么吗?

我必须在我的<li>项目上放置class="current" 这样解决了。

<li> class="current"将不起作用。

代替class="current" ,您需要在<li>部分中放置class="active"

下面是示例:

<li class="active">

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM