Javascript 使用jQuery选择子元素
我有三个框,每个框中都有一个图像,当我将鼠标悬停在父元素上时,试图显示这些图像。但是我只想看到悬停在上面的父对象的图像。这是我的密码Javascript 使用jQuery选择子元素,javascript,jquery,html,css,Javascript,Jquery,Html,Css,我有三个框,每个框中都有一个图像,当我将鼠标悬停在父元素上时,试图显示这些图像。但是我只想看到悬停在上面的父对象的图像。这是我的密码 jQuery(“.job\u col”).hover(函数(){ var current=jQuery(这个); jQuery(当前>“.plus”).addClass(“hi”); },函数(){ }); 施工现场监理人的角色 工资:20000至22000英镑 /图像/plus.png“alt=”“> 施工合同经理角色 工资:40000-45000英镑 /图
jQuery(“.job\u col”).hover(函数(){
var current=jQuery(这个);
jQuery(当前>“.plus”).addClass(“hi”);
},函数(){
});代码>
施工现场监理人的角色
工资:20000至22000英镑
/图像/plus.png“alt=”“>
施工合同经理角色
工资:40000-45000英镑
/图像/plus.png“alt=”“>
毕业生数量测量师角色
工资:20000至22000英镑
/图像/plus.png“alt=”“>
您可以使用-功能:
jQuery(".job_col").hover(function(){
var current = jQuery(this);
current.children(".plus").addClass("hi");
}, function(){
});
这将选择悬停的.job\u col
的子项,该子项具有类plus
jQuery(“.job\u col”).hover(函数(){
var current=jQuery(这个);
当前.find(“.plus”).addClass(“hi”);
},函数(){
});
作为替代解决方案:
当父对象悬停时,您不需要jQuery使元素出现。您只需使用CSS即可
img{
显示:无;}
.job_col:悬停img{
显示:块;
}
.乔布上校{
浮动:左;
宽度:33%
}
施工现场监理人的角色
工资:20000至22000英镑
施工合同经理角色
工资:40000-45000英镑
毕业生数量测量师角色
工资:20000至22000英镑
尝试使用find()
函数
jQuery(文档).ready(函数(){
jQuery(“.job\u col”).hover(函数(){
var current=jQuery(这个);
当前.find(“.plus”).addClass(“hi”);
},函数(){
var current=jQuery(这个);
当前.find(“.plus”).removeClass(“hi”);
});
});
施工现场监理人的角色
工资:20000至22000英镑
/图像/plus.png“alt=”“>
施工合同经理角色
工资:40000-45000英镑
/图像/plus.png“alt=”“>
毕业生数量测量师角色
工资:20000至22000英镑
/图像/plus.png“alt=”“>
jQuery(“.job\u col”).hover(函数(){
var current=jQuery(这个);
当前.find(“.plus”).addClass(“hi”);
},函数(){
});代码>
。您好{
颜色:红色;
}
施工现场监理人的角色
工资:20000至22000英镑
/图像/plus.png“alt=”“>
施工合同经理角色
工资:40000-45000英镑
/图像/plus.png“alt=”“>
毕业生数量测量师角色
工资:20000至22000英镑
/图像/plus.png“alt=”“>
使用或,两者在本例中均有效:
$(文档).ready(函数(){
$(“.job_col”).hover(函数(){
$(this.find(“.plus”).addClass(“hi”);
},函数(){
$(this.find(“.plus”).removeClass(“hi”);
});
});
.plus{
高度:50px;
宽度:50px;
}
.嗨{
高度:100px;
宽度:100px;
}
施工现场监理人的角色
工资:20000至22000英镑
施工合同经理角色
工资:40000-45000英镑
毕业生数量测量师角色
工资:20000至22000英镑
检查以下代码,可能会对您有所帮助
var x=0;
$('a')。单击(函数(){
如果(x==0){
$(this.parent().find('img').css('visibility','hidden');
x=1;
}
else{$(this.parent().find('img').css('visibility','visible');
x=0;
}
});
.plus{
可见性:隐藏;
}
a:悬停{光标:指针;
用户选择:无;
}div{float:left;}
老一套
老一套2
老一套
$(此)
是一个jQuery对象,而不是可以包含在新选择器中的字符串。use.closest()方法你为什么需要JQuery来完成这个任务?@Maharkus我没有想过使用css来完成这个任务,但现在我意识到如果我给每个人一个id,我就可以使用hoverthanks@Reece如果您需要帮助,请随时检查我的答案。也不要给每个元素一个id。您不需要添加id