web前端jquey应用,多个相同名class，添加一个事件，如何让其单个执行？？
代码：<html><head><style>.main{width:220px;height:160px;position:relative;float:left;mar...
代码：
<html>
<head>
<style>
.main{
width:220px;
height:160px;
position:relative;
float:left;
margin:5px;
}
.main_img{
width:220px;
height:160px;
background:green;
float:left;
z-index:0;
}
.main_back{
position:absolute;
width:220px;
height:45px;
margin:100px 0px 0px 0px;
background:black;
filter:alpha(opacity=60);
opacity:0.6;
z-index:1;
display:none;
}
</style>
</head>
<body>
<div class="main">
<div class="main_img"></div>
<div class="main_back"></div>
</div>
<div class="main">
<div class="main_img"></div>
<div class="main_back"></div>
</div>
</body>
<script>
$(function(){
$(".main").mouseover(function(){
$(".main_back").show(800);
})
$(".main").mouseout(function(){
$(".main_back").hide(800);
})
})
</script>
</html> 展开
<html>
<head>
<style>
.main{
width:220px;
height:160px;
position:relative;
float:left;
margin:5px;
}
.main_img{
width:220px;
height:160px;
background:green;
float:left;
z-index:0;
}
.main_back{
position:absolute;
width:220px;
height:45px;
margin:100px 0px 0px 0px;
background:black;
filter:alpha(opacity=60);
opacity:0.6;
z-index:1;
display:none;
}
</style>
</head>
<body>
<div class="main">
<div class="main_img"></div>
<div class="main_back"></div>
</div>
<div class="main">
<div class="main_img"></div>
<div class="main_back"></div>
</div>
</body>
<script>
$(function(){
$(".main").mouseover(function(){
$(".main_back").show(800);
})
$(".main").mouseout(function(){
$(".main_back").hide(800);
})
})
</script>
</html> 展开
1个回答
展开全部
题主你好，不知道我有没有get到你问题的意思，我理解的是当有多个元素都属于同一个类时，希望能够改变其中某一个具体元素的属性，这里我给你提供的是eq()方法，根据索引值来决定选中的是第几个元素，代码如下，如有描述不清的地方可以提出。
-----------------------------------------------------------------------------------------------
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
.xuxusheng{width:50px;height:50px;margin:10px;float:left;border:3px blue solid;} //设置div布局，边框为蓝色
</style>
</head>
<body>
<div class="xuxusheng"></div>
<div class="xuxusheng"></div>
<div class="xuxusheng"></div>
<div class="xuxusheng"></div>
<div class="xuxusheng"></div>
<script src="../jquery-2.1.3.min.js"></script>
<script>
$(".xuxusheng").eq(2).css("border-color","red");
//此时eq()索引值为2，选中的是类中第三个元素，修改其边框颜色为红色
</script>
</body>
</html>
------------------------------------------------------------------------------------------------
代码详细效果见下图：
------------------------------------------------------------------------------------------------
纯手打，如有本人理解错误或者叙述不详细的地方，欢迎指正~
注：我的jquery文件引用地址可能和你的不一样，如果要自己复制代码运行尝试的话请注意~
追问
很用心，谢谢你~。
本回答被提问者和网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
