0

请检查此链接,http ://ervaarelburg.nl/index1.html

我在子菜单中有问题,这是子菜单的 JS http://pastebin.com/MrJPDvct

所以我想当我点击菜单链接时,子菜单打开,然后点击其他任何地方,子菜单就会消失。问题是当我打开它时,它会因为这段代码而自动消失

$('html,body').click(function(event) {
     if(event.target.id == 'flip' || event.target.id == 'panel0' || event.target.id == 'panel1' || event.target.id == 'panel2' || event.target.id == 'panel3' || event.target.id == 'panel4' || event.target.id == 'panel5' || event.target.id == 'panel6'){
         $(".submenu").fadeIn("slow");
     }else{
         $(".submenu").fadeOut("slow");
     }
  });

类似于这个,http
://ervaarelburg.nl/ 但我想修改代码,index1.html所以你能帮忙吗?

提前致谢

4

2 回答 2

0

工作演示

尝试这个

添加event.stopPropagation();到每次.item点击

并在元素外单击淡出添加此

$('html').click(function() {
for(var i=6;i<=10;i++){ 
       $("#panel"+i).fadeOut("slow"); 
    }
    for(var i=0;i<=4;i++){ 
       $("#panel"+i).fadeOut("slow"); 
    }
});

希望这会有所帮助,谢谢

于 2013-09-26T15:58:22.047 回答
0

使用更指定的选择器会容易得多,然后在 if/else 子句中多次检查 event.target。尝试这样的事情:

    var isOpen = false;

// Clicking on the actual anchors shows in the submenu
$('#flip > ul li > a' ).on( 'click', function( e ) {
    e.preventDefault();
    $(".submenu").fadeIn( "slow", function() { isOpen = true; } );
});

$( document ).on( 'click', function( e ) {
    // If you clicked in the document, as long as you didn't click one of the
    // triggers, then close the menu.
    if( isOpen && ( $.inArray( e.target, $('#flip > ul > li > a' ) ) === -1 ) ) {
        $(".submenu").fadeOut("slow", function() { isOpen = false; } );
    }

});

JsFiddle:http: //jsfiddle.net/grammar/qEfbT/

希望这可以帮助

于 2013-09-26T15:08:52.173 回答