jQuery动态设置样式List item
前段时间,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的更多相关文章
- jQuery动态设置样式(style、css)
一.jQuery设置css样式 <div style="background-color:#ffffff;padding-left:10px;">测试jQuery动态获 ...
- JQuery动态修改样式
JQuery动态修改样式 SetStyle(); function SetStyle() { $(".toolbar").remove(); $(".placeholde ...
- 基于Jquery UI的autocompelet改写,自动补全控件,增加下拉选项,动态设置样式,点击显示所有选项,并兼容ie6+
Jquery UI的autocompelete改写 注意:实现功能,除了原版的自动补全内容外,增加一个点击显示所有选项,样式能动态设置. 加载数据的来源为后台数据库读取. 具体代码如下: 引用 从官方 ...
- 利用jQuery动态设置单选框的选中
一.需要实现的效果 这里使用jQuery来实现.需要实现的效果如下:当下拉条改变时,单选框选中的值随之变化. <!DOCTYPE html> <html> <head&g ...
- Jquery动态设置下拉框selected --(2018 08/12-08/26周总结)
1.Jquery动态根据内容设置下拉框selected 需求就是根据下拉框的值动态的设置为selected,本以为很简单,网上一大推的方法,挨着尝试了之后却发现没有一个是有用的.网上的做法如下: &l ...
- GradientDrawable类的利用动态设置样式中的颜色
1.xml样式文件 <?xml version="1.0" encoding="utf-8"?> <shape xmlns:android=& ...
- 【前端_js】jQuery动态设置元素的样式
1.用css()方法查询元素的某个样式 $("div").css("padding-left")); 2.用css()方法设置元素的样式 法一: $(" ...
- Silverlight C#动态设置样式
1.从页面资源中获取样式并应用 btnTest.Style = (Style)this.Resources["BigButtonStyle"] 2.从项目中单独分开的资源字典文件( ...
- js+jquery动态设置/添加/删除/获取元素属性的两种方法集锦对照(动态onclick属性设置+动态title设置)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/REC-html140 ...
随机推荐
- 上层建筑——DOM元素的特性与属性(dojo/dom-prop)
上一篇讲解dojo/dom-attr的文章中我们知道在某些情况下,attr模块中会交给prop模块来处理.比如: textContent.innerHTML.className.htmlFor.val ...
- 作业二--注册GitHub的过程
第一步:打开GitHub官网https://github.com/,在界面中输入账号名称.邮箱.密码,然后点击注册按钮. 第二步:注册完成后,选择Free免费账号完成初始设置. 第三步:验证邮箱,打开 ...
- AlwaysON同步的原理及可用模式
新一代读写分离技术——AlwaysOn 早在SQL Server 2005的时候微软就已经实现了数据库的查询分离技术——发布订阅.但生产库和查询库的同步性能较差,时常出现性能问题,因此在大型生产环境中 ...
- 如何开始DDD(完)
连续写了两篇文章,这一篇我想是序的完结篇了.结合用户注册的例子再将他简单丰富一下.在这里只添加一个简单需求,就是用户注册成功后给用户发一封邮件.补充一下之前的代码 public class Domai ...
- 用Python编写博客导出工具
用Python编写博客导出工具 罗朝辉 (http://kesalin.github.io/) CC 许可,转载请注明出处 写在前面的话 我在 github 上用 octopress 搭建了个人博 ...
- 使用后台服务数据更新UI
https://www.websmithing.com/2011/02/01/how-to-update-the-ui-in-an-android-activity-using-data-from-a ...
- 在设置代理的环境下使用SharePoint CSOM
SharePoint 的CSOM都是通过HttpRequest来实现和SharePoint服务器的交互的,那么我们如何设置HttpWebRequest的一些特性呢,如Cookie,WebProxy? ...
- Windows Live Writer 初次使用
Windows Live Writer 博客园文章的一款发布器,这篇文章就是通过其发布的,可以先在word中写好博客内容,直接粘贴到这里发布就OK,之前我都是先在Word中写好一份,然后在blogs ...
- JQuery checkbox check/uncheck
想通过JQuery来check或者uncheck页面上的checkbox控件,我们可能会想到用下面的代码: $('#chk-all').on('click', function(){ var chec ...
- Andrew Ng机器学习公开课笔记 -- Regularization and Model Selection
网易公开课,第10,11课 notes,http://cs229.stanford.edu/notes/cs229-notes5.pdf Model Selection 首先需要解决的问题是,模型 ...