Question

任何人都知道为什么以下不起作用？

$.each( data.d, function( index, item ) {

    // creates the tabs with custom ids
    $( "#tabs" ).tabs( "add", "page.aspx?id=" + item.id, item.name )
        .find('>ul>li:last')
        .attr('id', 'tab_' + item.id);

    // creates the buttons
    $( "#buttons" ).append( "<input type='button' id='buttona" + item.id + "' value='" + item.name + "'>" );

    // link buttons with tabs
    $( "#buttona" + item.id ).live('click', function() {
        $( "#tabs" ).tabs( "select" , "#tab_" + item.id );
    });

});

我正在尝试将id分配给标签，然后使用id选择标签。

单击按钮时，上述操作无效，并且根本不会返回任何错误。

使用index时工作正常，如下所示，但出于各种原因我需要使用id：

$.each( data.d, function( index, item ) {

    // creates the tabs
    $( "#tabs" ).tabs( "add", "page.aspx?id=" + item.id, item.name );

    // creates the buttons
    $( "#buttons" ).append( "<input type='button' id='button" + index + "' value='" + item.name + "-" + index + "'>" );

    // link buttons with tabs
    $( "#button" + index ).live('click', function() {
        $( "#tabs" ).tabs( "select" , index );
    });

});

Answer 1

您可以使用index()方法从标题的ID中获取标签的索引：

$("#button" + item.id).live("click", function() {
    $("#tabs").tabs("select", $("#tab_" + item.id).index());
});

由于在上面的代码中调用index()而没有参数，它将返回元素相对于其兄弟的索引，即其他标签头。

Answer 2

您可以使用标签的ID切换标签：

var $tabs = $("#tabs").tabs();

$("button").click(function() {
    $tabs.tabs( "select", "#tabs-6" );
});

Answer 3

在我看来，.index（）从1返回一个索引，这样如果我有3个标签并想要选择第三个标签，我应该返回：

$("#button" + item.id).live("click", function() {
    $("#tabs").tabs("select", $("#tab_" + item.id).index()-1);
});

根据id而不是索引选择jquery-ui-tab？

3 个答案: