javascript - jQuery 菜单不显示/隐藏

Question

我对这个 jquery 代码有一个小问题：如果我直接调用 openMenu 函数，它可以工作，但在 if 内部却没有。

 $(document).ready(function() {

 function checkMenu() {

 if($(this).find('ul').css('display') == 'none') {
    openMenu();
 } else { 
    closeMenu();
 }
 }

 function openMenu() {  
    $(this).find('ul').css({display: "block"});
 }

function closeMenu() {
  $(this).find('ul').css({display: "none"});
 }


 $('ul li:has(ul)').click(checkMenu);
 });

Answer 1

你可以让自己轻松并使用toggle()

$('ul li:has(ul)').click(function(){
    $(this).find('ul').toggle();
});

http://api.jquery.com/toggle/

Answer 2

你为什么不使用 .toggle() ？如：

$(this).find('ul').toggle();

您还可以使用慢速、正常、快速设置切换速度：

$(this).find('ul').toggle('fast');

Answer 3

openMenu 不知道“this”指的是什么。这应该工作...

$(document).ready(function() {

function checkMenu() {
    var me = $(this);
    if(me.find('ul').css('display') == 'none') {
        openMenu(me);
    } else {
        closeMenu(me);
    }
}

function openMenu(me) {

    //this isn't defined..
    me.find('ul').css({
        display: "block"
    });
}

function closeMenu(me) {
    me.find('ul').css({
        display: "none"
    });
}


$('ul li:has(ul)').click(checkMenu);

});

但其他人是对的。切换功能非常适合这样的事情。