Question

在标签中的某些事件之后，我想重新加载它。我需要将一个参数发送到加载到选项卡的页面。

以下内容重新加载页面：$（“＃tabs”）。tabs（'load'，6）;

但是，如何用它发送参数？

Answer 1

您可以在标签中加载其他网址以发送获取参数。

Answer 2

// Read a page's GET URL variables and return them as an associative array.
function getUrlVars()
{
    var vars = [], hash;
    var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');

    for(var i = 0; i < hashes.length; i++)
    {
        hash = hashes[i].split('=');
        vars.push(hash[0]);
        vars[hash[0]] = hash[1];
    }

    return vars;
}

然后你可以抓住url变量并相应地调整你的标签（我刚刚在一个项目上做了这个不超过一个小时!!）

取自snipplr.com的代码

Answer 3

您可以这样做：

var $tabs = $('#example').tabs();
var selected = $tabs.tabs('option', 'selected');
var newurl = "ajax/tab3.html?extraparm=4";
$tabs.tabs( 'url' , selected , newurl );
$tabs.tabs( 'load' , selected);

jquery ui tabs插件没有简单的功能来获取当前所选标签的网址，但是如果你做这样的事情就可以得到它：

$tabs.find('.ui-tabs-selected a').data('href.tabs');

这将允许您修改所需的网址。

您还可以执行以下操作：

var $tabs = $('#example').tabs();
var selected = $tabs.tabs('option', 'selected');
var extraData = {extraparm:4,otherparm:'foo'};
$tabs.tabs('option', 'ajaxOptions', { data: extraData });
$tabs.tabs( 'load' , selected);
$tabs.tabs('option', 'ajaxOptions', { data: {} });

这使用ajaxOptions设置要发送的额外数据，再次选择选项卡，然后将数据设置回空白对象。

Answer 4

我假设您的意思是GET参数，并且您希望从输入文本框和选择框等表单元素中获取它们...但我也将extraParams参数放在不符合此逻辑或您想要的参数中手动传递给函数：

function reloadTabWithParams(extraParams) {
   formParams = jQuery('#someSelectBox').attr('id) +'='+ jQuery('#someSelectBox').val() ;
   //formParams += whatever els....
   var tabIndex = jQuery('#tabs').tabs('option', 'selected');
   dataParam = typeof(extraParams) != 'undefined' ? extraParams+'&'+formParams : formParams;
   jQuery('#tabs').tabs('option', 'ajaxOptions', { data: dataParam });
   jQuery('#tabs').tabs( 'load' , tabIndex);
   jQuery('#tabs').tabs('option', 'ajaxOptions', { data: {} })
}

我忘了使用tabIndex而不是jQuery（'＃tabs'），但你应该这样做。

Answer 5

仅供参考，完成方式在版本1.10中已更改。在1.9中，他们弃用了＃34; ajaxOptions＆＃34;。这是我一直在使用的方法。从1.10开始，该技术根本不起作用。相反，你必须做如下

老路 $（＆＃34;＃tabs＆＃34;）。tabs（{ ajaxOptions：{ 用户名：＆＃34; foo＆＃34;，密码：＆＃34; bar＆＃34; } }）;

新方式

$( "#tabs" ).tabs({
    beforeLoad: function( event, ui ) {
        ui.ajaxSettings.username = "foo";
        ui.ajaxSettings.password = "bar";
    }
});

这来自http://jqueryui.com/upgrade-guide/1.9/#deprecated-ajaxoptions-and-cache-options-added-beforeload-event

Jquery选项卡使用参数重新加载

5 个答案: