用jquery实现点击首项变色,其它不变,点击次项时首项恢复原色。
我写的jquery代码,高人帮我指导一下哪里有错<scripttype="text/javascript">$(document).ready(function(){$(...
我写的jquery代码,高人帮我指导一下哪里有错
<script type="text/javascript">
$(document).ready(function(){
$(".menus a").first().addClass("cur");
.menus a:cur{color:red}
$(".menus a").click(function(){
$(".menus a").addClass("selected");
.menus a:selected{color:red}
$(this).removeClass(".menus a");
$(this).addClass(".menus a");
});
});
</script> 展开
<script type="text/javascript">
$(document).ready(function(){
$(".menus a").first().addClass("cur");
.menus a:cur{color:red}
$(".menus a").click(function(){
$(".menus a").addClass("selected");
.menus a:selected{color:red}
$(this).removeClass(".menus a");
$(this).addClass(".menus a");
});
});
</script> 展开
4个回答
展开全部
楼主这个是有点麻烦了,jQuery的思想是用很少的代码实现较复杂的功能。推荐简单的方法,代码如下:
jQuery Code:
$(function(){
$('.menus a').click(function(){
$(this).css('color','red').siblings().css('color','black');//当前点击变红,其它变黑(可以设置成需要的任意颜色,很简单吧,只一行代码)
});
});
Xhtml Code:
<div class="menus">
<a href="#">1</a>
<a href="#">2</a>
<a href="#">3</a>
</div>
jQuery Code:
$(function(){
$('.menus a').click(function(){
$(this).css('color','red').siblings().css('color','black');//当前点击变红,其它变黑(可以设置成需要的任意颜色,很简单吧,只一行代码)
});
});
Xhtml Code:
<div class="menus">
<a href="#">1</a>
<a href="#">2</a>
<a href="#">3</a>
</div>
展开全部
花了点时间写了详细注释,望采纳,呵呵~
$(document).ready(function(){ //dom树构建后执行以下代码
var $menu = $('.menus a');
$menu.click(function(){ //先给.menus 下的 所有的 a 绑定click事件
var i = $menu.index(this); //知道当前点的是哪个 i = 0 时指第一个
if(i===0){
$menu.first().addClass('selected'); //把第一个绑定上 selected
}else{
$menu.removeClass('selected'); //点的不是第一个的时候把所有a 上面的selected类去掉。
}
});
})
$(document).ready(function(){ //dom树构建后执行以下代码
var $menu = $('.menus a');
$menu.click(function(){ //先给.menus 下的 所有的 a 绑定click事件
var i = $menu.index(this); //知道当前点的是哪个 i = 0 时指第一个
if(i===0){
$menu.first().addClass('selected'); //把第一个绑定上 selected
}else{
$menu.removeClass('selected'); //点的不是第一个的时候把所有a 上面的selected类去掉。
}
});
})
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
不用这么复杂吧,不知道你是不是想要这个效果。
$(document).ready(function(){
$("div").click(function(){
$("div").removeClass("a")
$(this).addClass("a");
});
});
$(document).ready(function(){
$("div").click(function(){
$("div").removeClass("a")
$(this).addClass("a");
});
});
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
$(".menus a").click(function(){
$(this).addClass("selected").silblings().removeClass("selected");
});
$(this).addClass("selected").silblings().removeClass("selected");
});
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询