Html 添加类活动&；删除所选菜单的默认值
我已经创建了一个web应用程序，我想在其中突出显示所选的菜单 下面是我所拥有的Html 添加类活动&；删除所选菜单的默认值,html,css,drop-down-menu,menubar,multi-level,Html,Css,Drop Down Menu,Menubar,Multi Level,我已经创建了一个web应用程序，我想在其中突出显示所选的菜单 下面是我所拥有的 <div style="width: 80%;" align="left" > <span style="display:inline-block;" align="left" > <div id="menubar" class="grid-block"> <nav id="menu">
<div style="width: 80%;" align="left" >
<span style="display:inline-block;" align="left" >
<div id="menubar" class="grid-block">
<nav id="menu">
<ul class="menu menu-dropdown ">
<li class="level1 item101 active">
<a href="index.xhtml" class="level1">
<span>
<span class="icon" style="background-image: url('images/menu/icon_menu_home.png');background-repeat: no-repeat; background-position: top center">
</span>
Home
</span>
</a>
</li>
<li class="level1 item102 parent makeSpace default"
style="#{!PersonalInformationDataBean.pageViewData.contains('registerForPatentss') && !PersonalInformationDataBean.pageViewData.contains('success') && !PersonalInformationDataBean.pageViewData.contains('getReportss') && !PersonalInformationDataBean.pageViewData.contains('searhPatentss') ?'display:none':'display:inherit'};">
<a href="" class="level1 parent">
<span>
<span class="icon" style="background-image: url('images/menu/icon_menu_features.png');background-repeat: no-repeat; background-position: top center">
</span>Projects/Inventions
</span>
</a>
<div class="dropdown columns1">
<div class="dropdown-bg" style="overflow: hidden; width: 239px; height: 202px; ">
<div>
<div class="width100 column">
<ul class="level2">
<li class="level2 item200" style="width: 210px;#{PersonalInformationDataBean.pageViewData.contains('registerForPatentss')?'display:inherit':'display:none'}">
<a href="registerForPatentss.xhtml" class="level2">
<span>Register New Applicant
</span>
</a>
</li>
<li class="level2 item201" style="width: 210px;#{PersonalInformationDataBean.pageViewData.contains('success')?'display:inherit':'display:none'}">
<a href="success.xhtml" class="level2">
<span>Register New Project
</span>
</a>
</li>
<li class="level2 item202" style="width: 210px;#{PersonalInformationDataBean.pageViewData.contains('getReportss')?'display:inherit':'display:none'}">
<a href="getReportss.xhtml" class="level2">
<span>Project Reports
</span>
</a>
</li>
<li class="level2 item203" style="width: 210px;#{PersonalInformationDataBean.pageViewData.contains('searhPatentss')?'display:inherit':'display:none'}">
<a href="searhPatentss.xhtml" class="level2">
<span>Search For Project
</span>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</li>
<li class="level1 item102 parent makeSpace default" style="#{!PersonalInformationDataBean.pageViewData.contains('systemLog') && !PersonalInformationDataBean.pageViewData.contains('addUser') && !PersonalInformationDataBean.pageViewData.contains('changePass') && !PersonalInformationDataBean.pageViewData.contains('userlistss')?'display:none':'display:inherit'}">
<a href="" class="level1 parent">
<span>
<span class="icon" style="background-image: url('images/menu/icon_menu_features.png');background-repeat: no-repeat; background-position: top center">
</span>Administrative
</span>
</a>
<div class="dropdown columns1">
<div class="dropdown-bg" style="overflow: hidden; width: 209px; height: 202px; ">
<div>
<div class="width100 column">
<ul class="level2">
<li class="level2 item200" style="width: 180px;#{PersonalInformationDataBean.pageViewData.contains('addUserss')?'display:inherit':'display:none'}">
<a href="addUserss.xhtml" class="level2">
<span>Add User Account
</span>
</a>
</li>
<li class="level2 item201" style="width: 180px;#{PersonalInformationDataBean.pageViewData.contains('logPatentSystemss')?'display:inherit':'display:none'}">
<a href="logPatentSystemss.xhtml" class="level2">
<span>System Log
</span>
</a>
</li>
<li class="level2 item202" style="width: 180px;#{PersonalInformationDataBean.pageViewData.contains('changePass')?'display:inherit':'display:none'}">
<a href="changePass.xhtml" class="level2">
<span>Change Password
</span>
</a>
</li>
<li class="level2 item203" style="width: 180px;#{PersonalInformationDataBean.pageViewData.contains('userlistss')?'display:inherit':'display:none'}">
<a href="userlistss.xhtml" class="level2">
<span>Details Of Registered Users
</span>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</li>
</ul>
</nav>
</div>
</span>
</div>
请参见
jQuery:
$("#menubar").on("click","li",function(e){
e.preventDefault();
e.stopPropagation();
if($(this).hasClass("active"))
{
$(this).removeClass("active").addClass("default");
}
else
{
$(this).addClass("active").removeClass("default");
}
});
我所做的就在下面
var myURL = window.location.toString();
var endIndex = myURL.lastIndexOf(".", myURL);
var startIndex = myURL.lastIndexOf("/")+1;
var pageAccessed = myURL.substr(startIndex, endIndex-startIndex);
if (pageAccessed=="successLoginss") {
$(".homemenu").addClass("active");
$(".homemenu").removeClass("default");
}
<li class="level1 item101 default homemenu">
<a href="index.xhtml" class="level1">
<span>
<span class="icon" style="background-image: url('images/menu/icon_menu_home.png');background-repeat: no-repeat; background-position: top center">
</span>
Home
</span>
</a>
</li>
var myURL=window.location.toString（）；
var endIndex=myURL.lastIndexOf（“.”，myURL）；
var startIndex=myURL.lastIndexOf（“/”）+1；
var pageAccessed=myURL.substr（startIndex，endIndex startIndex）；
如果（pageAccessed==“successLoginss”）{
$（“.homemenu”）.addClass（“活动”）；
$（“.homemenu”）.removeClass（“默认”）；
}
是吗。。。。。我知道这不是正确的方法，但我必须这样做……你能给我们看看你的css/js吗？@Champ:我正在尝试从中获取菜单。我有css，但它的巨大，你可以从提供的链接看到它。在链接上，active正在添加，但我找不到相同的脚本。因此我需要我需要做的改变。。。请让我知道需要做什么。我已经添加了脚本，以便在单击事件上添加和删除（切换）类，查看helpsdemo链接是否不起作用。。。请你再检查一下，让我知道好吗？“我想你忘了存钱了，”法希帕卡说，“现在可以用了。”。你可以根据你的需要改变什么是链接不是我所期望的。。。当你点击子菜单时，该子菜单的颜色变为红色，这是我没有看到的。。。。。点击子菜单，主菜单的颜色应该会改变……你得到我想要的了吗？你能告诉我怎么做吗？？
var myURL = window.location.toString();
var endIndex = myURL.lastIndexOf(".", myURL);
var startIndex = myURL.lastIndexOf("/")+1;
var pageAccessed = myURL.substr(startIndex, endIndex-startIndex);
if (pageAccessed=="successLoginss") {
$(".homemenu").addClass("active");
$(".homemenu").removeClass("default");
}
<li class="level1 item101 default homemenu">
<a href="index.xhtml" class="level1">
<span>
<span class="icon" style="background-image: url('images/menu/icon_menu_home.png');background-repeat: no-repeat; background-position: top center">
</span>
Home
</span>
</a>
</li>