jquery 控制模板菜单样式
问题:网站中模板的超链接菜单点击到不同的页面后,添加选中的样式,同类元素删除选中样式
解决:
HTML:如
<li><span><i class="icon1"></i><a href="/Home/Announcement">通知公告</a> </span></li>
<li><span><i class="icon1"></i><a href="/Home/ClassActivity">班级活动</a> </span></li>
<li><span><i class="icon1"></i><a href="/Home/HallOfFame">光荣榜</a></span></li>
<li><span><i class="icon1"></i><a href="/Home/DisciplinesFeedback">学科反馈</a></span></li>
<li><span><i class="icon1"></i><a href="/Home/Memorandum">备忘录</a></span></li>
<li><span><i class="icon1"></i><a href="/Teacher/Announcement">通知公告</a> </span></li>
<li><span><i class="icon1"></i><a href="/Teacher/ClassActivity">班级活动</a> </span></li>
<li><span><i class="icon1"></i><a href="/Teacher/HallOfFame">光荣榜</a></span></li>
<li><span><i class="icon1"></i><a href="/Teacher/DisciplinesFeedback">学科反馈</a></span></li>
<li><span><i class="icon1"></i><a href="/Teacher/Memorandum">备忘录</a></span></li>
这是链接到不通的页面,每个页面选中后添加选中样式 "on"
Jquery:
$(function () {
var menus = $("#lnav").children().find("a");
var hturl = window.location.href;
$.each(menus, function (index, item) {
var url = $(item).attr("href");
var len = url.indexOf("/"); //控制器名称
var lastlen = url.lastIndexOf("/"); //方法名称
if (len >= 0) {
var t = url.substr(len, lastlen - 1); //获取的控制器名称
var action = url.substr(len); //a标签的跳转链接
var hlen = hturl.indexOf(t); //浏览器地址是不是有控制器名称
if (hlen >= 0) {
var haction = hturl.substr(hlen);//浏览器地址的跳转链接
if (action == haction) {
$(item).parents("li").addClass("on").siblings().removeClass("on");
}
}
}
});
});
转载于:https://www.cnblogs.com/Fyhong/archive/2013/04/08/3008332.html
jquery 控制模板菜单样式相关推荐
- 可控制导航下拉方向的jQuery下拉菜单代码
可控制导航下拉方向的jQuery下拉菜单代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ...
- 学习使用jquery控制select下拉选项的字体样式
学习使用jquery控制select下拉选项的字体样式 实现代码 实现代码 <script src="../jquery-2.1.4.min.js"></scri ...
- WPF 左侧菜单样式
之前做了一个菜单样式,这样的: 链接:WPF 修改(优化)Menu菜单的样式 如今又来一个左侧菜单样式,其实只是修改了一下模板,如下图: 还是老样子,代码全部都在MainWindow.xaml中: & ...
- 纯CSS菜单样式,及其Shadow DOM,Json接口 实现
先声明,要看懂这篇博客要求你具备少量基础CSS知识, 当然如果你只是要用的话就随便了,不用了解任何知识 先放一张效果图 Part 1:纯CSS菜单样式 先放样式代码 1 <sty ...
- jQuery实战3:菜单效果
菜单是web开发中常见的功能模块,它能够直观的展示给用户本站中有哪些功能.一般在页面中看到的菜单类型分为两种:横向菜单和纵向菜单. 今天分别来完成纵向菜单和横向菜单的功能.先来看看纵向菜单,首先导航栏 ...
- 近20个绚丽实用的jQuery/CSS3侧边栏菜单(转载)
http://developer.51cto.com/art/201510/493530.htm 近20个绚丽实用的jQuery/CSS3侧边栏菜单 jQuery作为一款主流的JavaScript前端 ...
- SharePoint 2010 技巧系列: 控制Ribbon菜单权限(SiteActions的例子)
上一篇写了一个关于快速开发Ribbon菜单的例子,这次我们共同探讨一下Ribbon菜单权限的控制. 如果你已经阅读了 "", 我相信你已经能很快的开发一个Ribbon菜单,这时我们 ...
- 近20个绚丽实用的jQuery/CSS3侧边栏菜单
jQuery作为一款主流的JavaScript前端开发框架,深受广告开发者的亲睐,同时jQuery有着不计其数的插件,特别是菜单插件更为丰富,本文将要为大家介绍20个绚丽而实用的jQuery侧边栏菜单 ...
- 19款绚丽实用的jQuery/CSS3侧边栏菜单
jQuery作为一款主流的JavaScript前端开发框架,深受广告开发者的亲睐,同时jQuery有着不计其数的插件,特别是菜单插件更为丰富,本文将要为大家介绍20个绚丽而实用的jQuery侧边栏菜单 ...
最新文章
- 发现了一个很好的做excel、ppt 水晶易表、spss的好网站
- python xlsxwriter使用方法汇总
- php脚本查杀,无敌强大的Shell脚本查杀各种PHP方便之门和Webshell
- 2018第九届蓝桥杯省赛真题 C语言B组 第一题
- python如何选择命令_python 解析命令行选项
- 2008铁路旅客列车时刻表_天津到新沂汽车卧铺大巴车长途汽车发车时刻表
- Oracle VM + Windows2003 Server 配置
- [debug] 命令行窗口运行.py文件,报错No module named XXX
- UIKeyboardType键盘
- 二维码生成(如何实现扫描二维码,实现网址自动跳转?):扫码直接进入网页,直接进入网址页面
- 一篇博文搞定英文常见单词后缀(完全版)
- 解决Office安装错误代码1024:安装程序无法打开注册表项UNKNOWN\Components\
- Android studio的ADBWifi使用
- 雷军给陈年总结的小米十条经验
- 前端导出excel,复杂表头,合并单元格,自定义样式
- 地图数据赋能ADAS的探索与实践
- 在编程中常见的一些英语词汇
- 从头开始学51单片机之4:C51程序设计基础
- VS快捷键,常用加粗
- PHD数据库介绍(一)
热门文章
- ubuntu20.04安装OPTEE
- flink sql client读取hive时卡住
- Spark数据倾斜-采样倾斜key并分拆join操作-详细图解与代码
- django.db.utils.OperationalError: no such column: catalogue_product.is_public
- Unknown custom element: xxx
- hexo的yelee主题中的标签字体大小的修改
- 日常生活中如何获得低咖啡因的茶叶
- sublime+virtualenv+pyspark执行的时候报Unable to load native-hadoop library for your platform
- mysql-workbench连接数据库
- java 程序分析题_java程序入门50题分析:002