Jquery 悬停时显示子元素，不悬停时隐藏

我有多个

span

元素具有相同的

prod_desc

类，默认情况下它们是隐藏的。现在我正在展示悬停，然而，问题是它们都出现了

我只想显示我当前悬停的元素。我想我需要用这个，但我不知道怎么用

父元素：

    <div id="results" style="width: 600px;"></div>

我也尝试过这个，但不起作用：

jQuery("div#results").hover(function () {
    jQuery(this).find("span.prod_desc").show();
}, function(){
    jQuery(this).find("span.prod_desc").hide();
});

我只想显示我当前悬停的元素

然后只需将悬停函数附加到所需的元素

jQuery("span.prod_desc").hover(function(){
    jQuery(this).show();
     },function(){
   jQuery(this).hide();
 });

但是

默认情况下，它们是隐藏的

---

你是如何悬停它们的？？？

只需使用CSS即可。我认为问题可能在于元素如何放置在页面上以及jQuery事件如何工作。用CSS规则试试这个，看看它是如何工作的

#results .prod_desc {
  display: none;
}

#results:hover .prod_desc {
  display: block;
}

---

如果这些是动态添加的，请尝试以下操作

jQuery(document).on('hover', '#results', function () {
    jQuery("span.prod_desc").show();
}, function(){
    jQuery("span.prod_desc").hide();
});

---

这解决了我的问题

jQuery(document).ajaxComplete(function(){
if(jQuery('.prod').length != 0) {
    jQuery(".prod").hover(function(){
    jQuery(this).find(".prod_title").hide();
    jQuery(this).find(".prod_desc").fadeIn();
},function(){        
jQuery(this).find(".prod_desc").fadeOut(); 

jQuery(this).find(".prod_title_wrap").show();
jQuery(this).find(".prod_title").show();
});

}

---

在ajax调用返回之前，我正在检查。因此，我正在使用它，等待它完成，然后执行进一步的检查。感谢大家的关注。

OMG现在为什么要否决投票？你能发布一些HTML标记吗？我已经编辑并加入了htmlI。我会尝试CSS规则并对你的代码进行注释。这让事情变得容易多了。我很困惑，你说‘它们默认是隐藏的’你怎么让它们悬停？？你能创建小提琴吗？默认情况下，我的意思是说，在ajax渲染时，我已经将跨度设置为无显示。因此，现在当我悬停父元素结果时，我希望显示跨度。正在显示，但所有跨度都已显示我正在尝试显示prod_desc.prod已显示。prod是prod_desc类的父类，然后将其从.prod更改为.prod_desc，并为您的特定问题编辑答案。

jQuery(document).on('hover', '#results', function () {
    jQuery("span.prod_desc").show();
}, function(){
    jQuery("span.prod_desc").hide();
});

jQuery(document).ajaxComplete(function(){
if(jQuery('.prod').length != 0) {
    jQuery(".prod").hover(function(){
    jQuery(this).find(".prod_title").hide();
    jQuery(this).find(".prod_desc").fadeIn();
},function(){        
jQuery(this).find(".prod_desc").fadeOut(); 

jQuery(this).find(".prod_title_wrap").show();
jQuery(this).find(".prod_title").show();
});