如何编写jQuery只有当一个子div有一个类

我有一个菜单，将在PHP中生成将有可能在其中有两个不同的子div。长话短说，php将在“li”中添加一个类名为“showBubbles”的div，和/或另一个类名为“hideLogo”的div。如果存在“showBubbles”div，则需要执行一个函数，如果存在“hideLogo”，则需要执行另一个函数。我怎样才能在鼠标悬停上做到这一点？结构看起来像这样：如何编写jQuery只有当一个子div有一个类

<ul> 
<li> 
    <a href="#"><img src="imagePlaceholder" /></a> 
    <div class="showBubbles"></div> 
    <div class="hideLogo"></div> 
</li> 
</ul>

来源

2012-09-06 TripsLeft

，做你需要的，如果双方的div都存在过于同时执行的功能呢？ – bfavaretto

是的，如果只有一个或两个都存在，两个功能都需要触发 – TripsLeft

未经测试，但这应该是诀窍。

$('ul').on('mouseover', 'li', function(e) 
{ 
    if($(this).children('div').hasClass('showBubbles')) 
    { 
     // Execute code for showBubbles div 
    } 
    else 
    { 
     // Execute code if 'showBubbles' is not present 
    } 
}

来源

2012-09-06 16:39:47

这是为我工作的解决方案。谢谢！ – TripsLeft

您可以检查是否试图用jQuery选择它，然后检查返回的jQuery对象的length与某一类股利。例如，对于showBubbles：

var showBubblesExists = $('li .showBubbles').length > 0;

我相信这应该指向你正确的解决方案。

来源

2012-09-06 16:40:44 bfavaretto

尝试像下面，

var sb = 0, hb = 0; 
$('li').hover(function() { 
    sb = $('.showBubbles', this).length; 
    hb = $('.hideLogo', this).length; 

    if (sb) { /*function for sb*/ } 
    if (hb) { /*function for hb*/ } 

}, function() { 

    if (sb) { 
    //function for sb 
    sb = 0; 
    } 
    if (hb) { 
    //function for hb 
    hb = 0; 
    } 
});

来源

2012-09-06 16:41:01

悬停回调函数里面，你可以使用下面的代码：

var showBubbles = $("li div.showBubbles").length; 
if(showBubbles > 0){ 
    // first function here 
} 

var hideLogo = $("li div.hideLogo").length; 
if(hideLogo > 0){ 
    // second function here 
}

来源

2012-09-06 16:41:29 zeacuss

我需要把“这个”放在那里吗？ – TripsLeft

这与其他答案一样，除了我一次性编写了模式'li div.hideLogo'，但其他人选择了'li'并且在回调中，其中'this'指向他们选择的'li'其余的模式。结果是一样的。 – zeacuss

$('ul').on('mouseover', 'li', function() { 

    $(this).find('div.showBubbles').length && showBubbles(); //calls showBubbles() 

    $(this).find('div.hideLogo').length && hideLogo(); //calls hideLogo() 

});

来源

2012-09-06 16:49:54

试试这个

JS代码

$('li').hover(function(){ 
    if($(this).find('.showBubbles')){ 
     showBubbles(); 
    } 
    if($(this).find('.hideLogo')){ 
     hideLogo(); 
    } 
}); 

function showBubbles(){ 
    alert('showBubbles response'); 
} 

function hideLogo(){ 
    alert('hideLogo response'); 
}

JS FIDDLE CODE

来源

2012-09-06 17:00:22 Codegiant

@TripsLeft是代码工作？如果需要修改，请通知。 – Codegiant

如何编写jQuery只有当一个子div有一个类

回答

相关问题