如何使用jQuery触发选项卡

时间:2017-01-05 10:15:20

标签: javascript jquery jquery-ui-tabs

我必须根据查询字符串打开表格,我尝试了一些东西,但它似乎没有工作

http://codepen.io/anon/pen/ygyzLX

if (tabid == "tabD3") {
    $('.donate-tab li:nth-child(3)').toggleClass('active');
    $('.donate-tab li:nth-child(3) a').trigger("click");
    // $('a.#tabD3').trigger("click");
}

$('.donate-tab li:nth-child(3)').toggleClass('active');突出显示标签,但不显示内容。

以下代码没有任何区别

$('.donate-tab li:nth-child(3) a').trigger("click");
// $('a.#tabD3').trigger("click");

1 个答案:

答案 0 :(得分:0)

我设法使用以下脚本

 var getQueryString = function (field, url) {
            var href = url ? url : window.location.href;
            var reg = new RegExp('[?&]' + field + '=([^&#]*)', 'i');
            var string = reg.exec(href);
            return string ? string[1] : null;
        };

        var tabid = null;
        tabid = getQueryString('tab'); // returns 'chicken'
        if (tabid !=null)
        {
            $('.donate-tab li').removeClass('active');
            $('.tab-content > .tab-pane').removeClass('active');

            if (tabid == "tabD1") {
                $('.donate-tab li:nth-child(1)').toggleClass('active');
                $('.tab-content #tabD1').toggleClass('active');
            }
            if (tabid == "tabD2") {
                $('.donate-tab li:nth-child(2)').toggleClass('active');
                $('.tab-content #tabD2').toggleClass('active');
            }
            if (tabid == "tabD3") {
                $('.donate-tab li:nth-child(3)').toggleClass('active');
                $('.tab-content #tabD3').toggleClass('active');
            }
            if (tabid == "tabD4") {
                $('.donate-tab li:nth-child(4)').toggleClass('active');
                $('.tab-content #tabD4').toggleClass('active');
            }
            if (tabid == "tabD5") {
                $('.donate-tab li:nth-child(5)').toggleClass('active');
                $('.tab-content #tabD5').toggleClass('active');
            }

        }