1

Having some trouble with more than one switch statement at a time:

$(document).ready(function(){
    $('#menu').children('span').click(function(){
        whichsub = $(this).attr('id');
        switch (whichsub)   {
            case 'menu1':
            $('#submenu').load('menus/submenu1.html');
            break;
            case 'menu2':
            $('#submenu').load('menus/submenu2.html');
            break;
        };
        if ( $('#submenu').css('left') !== '150px' ) {$('#submenu').animate({left: '150px'}, 300);}
    });
    $('#submenu').children('span').click(function(){
        var whichcon = $(this).attr('id');
        switch (whichcon)   {
            case 'submenu1':
            $('#demopanel').load('content/profile.html');
            break;
            case 'submenu2':
            $('#demopanel').load('content/portfolio.html');
            break;
        };
        if ( $('#demopanel').css('marginLeft') !== '300px' ) {$('#demopanel').animate({marginLeft: '300px'}, 1000);}
    });
});

The top switch changes the submenu and conditionally slides it out, the bottom changes the content ("#demopanel"). Each works on it's own, but when I have both enabled, the second fails to work -- it acts as if the script has stopped since an alert placed after $('#submenu').children('span').click(function(){ returns nothing.

Any ideas where this might be going wrong? Do I need to unbind something?

Thanks.

4

2 回答 2

0

您的子菜单似乎正在动态加载，因此必须使用委托事件。尝试这个..

  $('body').on('click','#submenu span',function(){
  ...

})
于 2013-04-05T20:59:16.327 回答
0

委托子菜单单击，因为看起来您正在使用on..加载动态内容

$('#submenu').on('click','span',function(){
  ...

})

链接以阅读有关委派事件的更多信息

于 2013-04-05T20:06:11.170 回答