Question

我做了这个小提琴：

现在，我正在尝试做的是，如果选项卡选择了Tab作为其类，则显示相应的div。我已经设置了if语句，但我不确定从哪里开始，

任何帮助表示赞赏！

Answer 1

我已经考虑了代码，以便在函数showTab中显示一个标签：

var showTab = function(id) {
    $tab = $("#" + id);
    $('.tabTrigger').removeClass('selectedTab');
    $tab.addClass('selectedTab');
    $('.tabContent').hide();
    $('#' + id.replace('tab','content')).show();
}

其余的很容易：

// Show the selected tab, or the first one if none is selected
var selectedId = $('.tabTrigger.selectedTab').attr('id');
showTab(selectedId || $('.tabTrigger:first').attr('id'));

// Set up the click handlers
$('.tabTrigger').click(function(){
    showTab(this.id);
});

作为一般说明，在所有这些情况下，您需要将要运行的代码分解为自包含函数。一旦你这样做，剩下的就自然了。

Answer 2

请尝试使用$('.tabTrigger.selectedTab')作为选择器，然后使用.show()来显示它们：

$('.tabTrigger.selectedTab').show();

http://jsfiddle.net/mattlunn/4CtLV/1/

Answer 3

尝试我的更新：http://jsfiddle.net/4CtLV/5/

$(document).ready(function() {
    $('.tabContent:gt(0)').hide();
    $('.tabTrigger:first').addClass('selectedTab');
    var selectedTab = $('.tabTrigger.selectedTab:first');
    if (selectedTab.length == 1) {
        $('#' + selectedTab.attr('id').replace('tab', 'content')).show();
    }
    $('.tabTrigger').click(function() {
        $('.tabTrigger').removeClass('selectedTab');
        $(this).addClass('selectedTab');
        $('.tabContent').hide();
        var id = $(this).attr('id');

        id = id.replace('tab', 'content');

        $('#' + id).show();
    });
});

jQuery如果是hasClass动作

3 个答案: