jQuery点击改变Class 修改css 样式
有4个链接,其中有第1-3个的样式都是class=w1,第4个是class=w2;当再点击那1-4个中的任意一个链接比如第3个时,此时只有第3个的样式为class=w2,...
有4个链接,其中有第1-3个的样式都是class=w1,第4个是class=w2;
当再点击那1-4个中的任意一个链接比如第3个时,此时只有第3个的样式为class=w2,其余的均为class=w1。我写的代码实现不了,请高手指点。
<SCRIPT src="/jquery-1.4.2.min.js" type="text/javascript"></SCRIPT>
<style type="text/css">
.w1 { font-size:14px;}
.w2 { font-size:20px;}
</style>
<body>
<ul>
<li class="w1"><a href="/Untitled-1.html" >公司简介</a></li>
<li class="w1"><a href="/Untitled-1.html" >企业文化</a></li>
<li class="w1"><a href="/Untitled-1.html" >发展战略</a></li>
<li class="w1"><a href="/Untitled-1.html" >服务范畴</a></li>
</ul>
</body>
<script type="text/javascript">
$(function(){
$('w1').click(){
$(this).removeClass('w1');
$(this).addClass('w2');
}
});
</script> 展开
当再点击那1-4个中的任意一个链接比如第3个时,此时只有第3个的样式为class=w2,其余的均为class=w1。我写的代码实现不了,请高手指点。
<SCRIPT src="/jquery-1.4.2.min.js" type="text/javascript"></SCRIPT>
<style type="text/css">
.w1 { font-size:14px;}
.w2 { font-size:20px;}
</style>
<body>
<ul>
<li class="w1"><a href="/Untitled-1.html" >公司简介</a></li>
<li class="w1"><a href="/Untitled-1.html" >企业文化</a></li>
<li class="w1"><a href="/Untitled-1.html" >发展战略</a></li>
<li class="w1"><a href="/Untitled-1.html" >服务范畴</a></li>
</ul>
</body>
<script type="text/javascript">
$(function(){
$('w1').click(){
$(this).removeClass('w1');
$(this).addClass('w2');
}
});
</script> 展开
6个回答
推荐于2016-10-01
展开全部
CSS样式修改:
jQuery中还有一些方法直接返回或者设置元素的CSS属性。
css():
读操作: 获取匹配元素集合中第一个元素的指定样式值(一个或多个)。
注:读取多个样式值的操作是在jQuery v1.9才加入的。
写操作: 为匹配元素集合中的每一个元素设置一个或多个CSS属性的值。
传入的参数可以是单个的键值对,也可以是PlainObject指定的多个值,还可以是function.(v1.4).。
jQuery会处理各个浏览器中不太相同的一些具体情况,比如W3C的cssFloat在IE中是styleFloat,在jQuery中,你可以使用float,然后jQuery会帮你把它翻译成每个浏览器中应该有的正确名称。
还有,jQuery会合理解读CSS和DOM格式的多词属性,比如.css(“background-color”)和.css(“backgroundColor”),它都是可以处理的。
jQuery中还有一些方法直接返回或者设置元素的CSS属性。
css():
读操作: 获取匹配元素集合中第一个元素的指定样式值(一个或多个)。
注:读取多个样式值的操作是在jQuery v1.9才加入的。
写操作: 为匹配元素集合中的每一个元素设置一个或多个CSS属性的值。
传入的参数可以是单个的键值对,也可以是PlainObject指定的多个值,还可以是function.(v1.4).。
jQuery会处理各个浏览器中不太相同的一些具体情况,比如W3C的cssFloat在IE中是styleFloat,在jQuery中,你可以使用float,然后jQuery会帮你把它翻译成每个浏览器中应该有的正确名称。
还有,jQuery会合理解读CSS和DOM格式的多词属性,比如.css(“background-color”)和.css(“backgroundColor”),它都是可以处理的。
展开全部
$(this).removeClass('w1');
$(this).addClass('w2');
$(this).siblings().removeClass("w2");
$(this).siblings().addClass("w1");提交回答
$(this).addClass('w2');
$(this).siblings().removeClass("w2");
$(this).siblings().addClass("w1");提交回答
更多追问追答
追问
光点击,没反应啊
追答
没反应是这个$('w1').click(),要改成$('.w1').click(function(){,看清楚小数点!
类要用小数点,Id用#号;
$(function(){
$(".w1").click(function(){
$(this).removeClass("w1");
$(this).addClass("w2");
$(this).siblings().removeClass("w2");
$(this).siblings().addClass("w1");
});
});
或者你写成一条吧:
$(this).removeClass("w1").addClass("w2").siblings().removeClass("w2").addClass("w1");
另外attr()也可以,你直接上百度attr()就可以看到他的使用了。
百度第一条:
jQuery 属性操作 - attr() 方法
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
这个有两个方法 一个是$("你要的id").click(fuction(){
$(this).each(遍历)
首先要移除Class
再是添加Class
//或者是用parent结点找元素
移除
添加
})
$(this).each(遍历)
首先要移除Class
再是添加Class
//或者是用parent结点找元素
移除
添加
})
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
$(function(){
$('.w1').click(){
$(this).removeClass('w1').siblings('.w2').removeClass('w2').addClass('w1');
}
}
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询