Question

我只是想知道是否有更好的方法来做到这一点：

// Show/hide filters on mobile //
$('#openMobileFilters').click(function(){   
    $('.navbar-inverse').addClass("hidden-xs"); 
    $('#results-container').addClass("hidden-xs");
    $('#filter-column').removeClass("hidden-xs");                       
});
$('.closeFilters').click(function(){
    $('#results-container').removeClass("hidden-xs");
    $('.navbar-inverse').removeClass("hidden-xs");      
    $('#filter-column').addClass("hidden-xs");          
});

它所做的只是隐藏一些东西onclick并显示过滤器div。然后在用户点击.closeFilters链接时将其关闭。

Answer 1

如何使用toggleClass方法

// Show/hide filters on mobile //
$('#openMobileFilters').click(function(){   
    showOrHideFilter(true);
});
$('.closeFilters').click(function(){
    showOrHideFilter(false);         
}); 

function showOrHideFilter(show) {
    $( "#results-container, .navbar-inverse" ).toggleClass( "hidden-xs", show );
    $('#filter-column').toggleClass("hidden-xs", !show); 
}

移动打开/关闭面板

1 个答案: