0

我有两个面板。对于两个面板，我有两个打开按钮。所以，当我点击第一个按钮时，我的第一个面板被打开。一切安好。但是现在，当我需要打开下一个面板时，我想先关闭它。这样两个面板就不会同时打开。我不想为那些添加单独的类，只想使用opened类。这是我的代码和 thx 的帮助：

$('.js-sp-closing-button.opened').live('click', function(){
    if($(this).next.next('.js-scrolling-list').hasClass('opened_panel')){
       $(this).removeClass('opened_panel')
    }
});

<span class="top_ticker_small_02 js-sp-closing-button opened">All</span>
<div class="pp_elements js-scrolling-list opened_panel">...</div>
...
<span class="top_ticker_small_02 js-sp-closing-button">All</span>
<div class="pp_elements js-scrolling-list">...</div>
4

4 回答 4

3

You missed the next parenthesis, .next.next( 将是 .next().next(.You can pass class name to next function instead of having two next function调用，如果你不是故意跳过元素。

$('.js-sp-closing-button.opened').live('click', function(){
    if($(this).next().next('.js-scrolling-list').hasClass('opened_panel')){
       $(this).removeClass('opened_panel')
    }
});
于 2012-11-15T10:29:33.337 回答
2

关于打开和关闭面板的问题，为什么不在打开新面板之前关闭所有面板。就像是：

$('.js-sp-closing-button.opened').live('click', function(){
    //Close all panels
    $('.js-scrolling-list').removeClass('opened_panel');
    /** Code to open next panel **/
});

另外，.next是一个方法，你需要用括号来调用它。

$('.js-sp-closing-button.opened').live('click', function(){
    if($(this).next().next('.js-scrolling-list').hasClass('opened_panel')){
       $(this).removeClass('opened_panel')
    }
});

根据您的意图，两次调用 .next() 可能是不必要的。如果这两个面板是同级面板，则只需调用 .next() 指定选择器即可.js-scrolling.list。

示例：

$('.js-sp-closing-button.opened').live('click', function(){
    if($(this).next('.js-scrolling-list').hasClass('opened_panel')){
       $(this).removeClass('opened_panel')
    }
});
于 2012-11-15T10:29:56.013 回答
1

做到这一点要容易得多......

$('.js-scrolling-list').live('click', function(){

    $('.js-scrolling-list').removeClass('opened_panel');
    $(this).addClass('opened_panel');

});

示例：http: //jsfiddle.net/snKM8/2/

于 2012-11-15T10:41:42.310 回答
0

这是我设法得到的，工作很好 - 也许将来有人会受益。谢谢你们所有人：

$('.js-sp-closing-button').live('click', function(){
    $(this).toggleClass('opened');
    if ($(this).hasClass('opened')){
        $('.js-sp-closing-button').removeClass('opened');
        $(this).addClass('opened');
        $('.js-scrolling-list').removeClass('opened_panel');
        $(this).next('div').addClass('opened_panel');
    } else {
        $('.js-sp-closing-button').removeClass('opened');
        $(this).next('div').removeClass('opened_panel');
        $(this).removeClass('opened');
    }
});
于 2012-11-15T11:15:23.820 回答