前段时间,Insus.NET有修改一个功能《激活当前视图菜单高亮呈现http://www.cnblogs.com/insus/p/5287093.html

今天Insus.NET想改用另外一个方法来实现,使用jQuery。

在ASP.NET MVC 环境实现:

代码:

<ul>
<li><a href="#">Malaysia (2)</a></li>
<li><a href="#">Thailand (0)</a></li>
<li><a href="#">Philippines (2)</a></li>
<li class="active"><a href="#">China (0)</a></li>
<li><a href="#">Hong Kong (0)</a></li>
</ul>
 $(function () {
$('ul li a').click(function () {
$(this).parent().addClass('active').siblings().removeClass('active');
});
});

jQuery的语法中,使用了一个siblings()方法,这是所有同胞元素,所有同级元素或所有邻居元素。
即是说所有相同的元素中,只有一个元素使用active这个样式。如果其它元素有使用的将被移除。

动态演示:

jQuery动态设置样式List item的更多相关文章

  1. jQuery动态设置样式(style、css)

    一.jQuery设置css样式 <div style="background-color:#ffffff;padding-left:10px;">测试jQuery动态获 ...

  2. JQuery动态修改样式

    JQuery动态修改样式 SetStyle(); function SetStyle() { $(".toolbar").remove(); $(".placeholde ...

  3. 基于Jquery UI的autocompelet改写,自动补全控件,增加下拉选项,动态设置样式,点击显示所有选项,并兼容ie6+

    Jquery UI的autocompelete改写 注意:实现功能,除了原版的自动补全内容外,增加一个点击显示所有选项,样式能动态设置. 加载数据的来源为后台数据库读取. 具体代码如下: 引用 从官方 ...

  4. 利用jQuery动态设置单选框的选中

    一.需要实现的效果 这里使用jQuery来实现.需要实现的效果如下:当下拉条改变时,单选框选中的值随之变化. <!DOCTYPE html> <html> <head&g ...

  5. Jquery动态设置下拉框selected --(2018 08/12-08/26周总结)

    1.Jquery动态根据内容设置下拉框selected 需求就是根据下拉框的值动态的设置为selected,本以为很简单,网上一大推的方法,挨着尝试了之后却发现没有一个是有用的.网上的做法如下: &l ...

  6. GradientDrawable类的利用动态设置样式中的颜色

    1.xml样式文件 <?xml version="1.0" encoding="utf-8"?> <shape xmlns:android=& ...

  7. 【前端_js】jQuery动态设置元素的样式

    1.用css()方法查询元素的某个样式 $("div").css("padding-left")); 2.用css()方法设置元素的样式 法一: $(" ...

  8. Silverlight C#动态设置样式

    1.从页面资源中获取样式并应用 btnTest.Style = (Style)this.Resources["BigButtonStyle"] 2.从项目中单独分开的资源字典文件( ...

  9. js+jquery动态设置/添加/删除/获取元素属性的两种方法集锦对照(动态onclick属性设置+动态title设置)

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/REC-html140 ...

随机推荐

  1. EF 外键问题

    在做一个评论功能的时候,发现用户的id不对,打开数据库一看,莫名其妙的新增了几个用户.明显是将外键中的用户新增到用户表中了. 评论表: public class CourseComment : Bas ...

  2. Winform启动隐藏,WebBrowser交互JS

    一.启动隐藏 Winform比较奇怪,Load的时候设置Visiable=false,无效.webBrowser_DocumentCompleted之后调用hide隐藏了窗体,但是在notifyIco ...

  3. (文摘)彻底理解webservice SOAP WSDL

    WebServices特点介绍 WebServices 提供一个建立分布式应用的平台,使得运行在不同操作系统和不同设备上的软件,或者是用不同的程序语言和不同厂商的软件开发工具开发的软件,所有可能的已开 ...

  4. [FPGA] 1、开发板使用和引脚连接

    目录 1.注意事项 2.设备简介 3.引脚分配 注意事项: ① 插拔下载线时必须断电! ② Quartus II 软件和 NIOS 软件的版本必须一致,并安装在同一个目录下面,安装目录不要有中文和空格 ...

  5. mysql 的简单优化

    合理的建立索引的建议: (1)  越小的数据类型通常更好:越小的数据类型通常在磁盘.内存和CPU缓存中都需要更少的空间,处理起来更快. (2)  简单的数据类型更好:整型数据比起字符,处理开销更小,因 ...

  6. python学习 数据类型之序列

    一.序列(本文使用python3.5)############################################################# 列表.元组 字符窜都是序列#特点:#1 ...

  7. 如何优雅的使用vue+vux开发app -02

    如何优雅的使用vue+vux开发app -02 很明显这又是一个错误的示范,请勿模仿 使用动态组件实现保留状态的路由 <!DOCTYPE html> <html> <he ...

  8. KnockoutJS 3.X API 第三章 计算监控属性(5) 参考手册

    计算监控属性构造参考 计算监控属性可使用以下形式进行构造: ko.computed( evaluator [, targetObject, options] ) - 这种形式是创建一个计算监控属性最常 ...

  9. 基于Rest服务实现的RPC

    前言:现在RPC成熟的框架已经很多了,比喻Motan和Dubbo,但是今天我这里提供一种基于Rest服务的Rpc.和上一篇连着的http://www.cnblogs.com/LipeiNet/p/58 ...

  10. CSS垂直三列居中,中间自适应

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...