基于URL定义默认的jQuery选项卡 [英] Defining default jQuery tab based on URL

问题描述

我有一个jQuery搜索脚本，它为用户使用制表符来定义他们想要的搜索类型。使用 $（'＃type_search'）。click（）; 选择一个选项卡作为默认选项。但是，刷新结果页面时会导致问题。如果选择了不同的搜索类型，然后刷新了页面，则默认选项卡会自动选中，因此即使页面URL说明它是正确的，它也不会返回正确的结果。

I have a jQuery search script that uses tabs for the user to define the search type they want. A tab is selected as the default by using $('#type_search').click(); however this causes a problem when refreshing a results page. If a different search type is selected and then the page is refreshed, the default tab is automatically selected so it doesn't return the correct results even though the page URL says it is correct.

我的问题是，如果查询处于活动状态并且没有活动查询使用默认选项卡，那么如何从URL中的部分定义默认选项卡？我希望你能理解我在说什么。

My question is, how can I define the default tab from the section in the URL if a query is active and if there is no active query use the default tab? I hope you can understand what I'm saying.

我的jQuery代码是：

My jQuery code is:

$(document).ready(function () {
    $('[id^=type_]').click(function () {
        type = this.id.replace('type_', '');
        $('[id^=type_]').removeClass('selected');
        $('#type_' + type).addClass('selected');
        return false;
    });
    $('#type_search').click();
    $('#query').keyup(function () {
        var query = $(this).val();
        var url = '/' + type + '/' + query + '/';
        window.location.hash = '' + type + '/' + query + '/';
        document.title = $(this).val() + ' - My Search';
        $('#results').show();
        if (query == '') {
            window.location.hash = '';
            document.title = 'My Search';
            $('#results').hide();
        }
        $.ajax({
            type: 'GET',
            url: url,
            dataType: 'html',
            success: function (results) {
                $('#results').html(results);
            }
        });
    });
    if (window.location.hash.indexOf('#' + type + '/') == 0) {
        query = window.location.hash.replace('#' + type + '/', '').replace('/', '');
        $('#query').val(decodeURIComponent(query)).keyup();
    }
    var textlength = $('#query').val().length;
    if (textlength <= 0) {
        $('#query').focus();
    } else {
        $('#query').blur();
    }
});

推荐答案

啊，我也有这个问题。这很简单。

Ah, I had that problem too. It's pretty simple. On page ready you just take the anchor from the URL and simulate a click.

$(document).ready(function() {
  url = document.location.href.split('#');
  $('#'+url[1]).click();
});

这篇关于基于URL定义默认的jQuery选项卡的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！