标签: jquery-ui-tabs

我定义了一个像这样的jQuery tabs元素:

    <div id="tabs">
        <ul>
            <li><a href="#tabs-1">Nunc tincidunt</a></li>
            <li><a href="#tabs-2">Proin dolor</a></li>
            <li><a href="#tabs-3">Aenean lacinia</a></li>
        </ul>
        <div id="tabs-1">
            <p>Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, risus. Curabitur nec arcu. Donec sollicitudin mi sit amet mauris. Nam elementum quam ullamcorper ante. Etiam aliquet massa et lorem. Mauris dapibus lacus auctor risus. Aenean tempor ullamcorper leo. Vivamus sed magna quis ligula eleifend adipiscing. Duis orci. Aliquam sodales tortor vitae ipsum. Aliquam nulla. Duis aliquam molestie erat. Ut et mauris …

是否可以使用外部按钮激活选项卡？

例如,如果我有3个标签,是否可以通过button1激活标签1,按钮2激活标签2等等？

到目前为止我有以下脚本:

http://jsfiddle.net/FXTVG/

任何人都知道为什么这个jsfiddle中的微调器根本没有显示:

http://jsfiddle.net/bJ9sq/1/

码:

$(function() {
    $( "#tabs" ).tabs({
      beforeLoad: function( event, ui ) {
        ui.jqXHR.error(function() {
          ui.panel.html(
            "Couldn't load this tab. We'll try to fix this as soon as possible. " +
            "If this wouldn't be a demo." );
        });
      },
        spinner: '<img src="http://www.ajaxload.info/cache/FF/FF/FF/00/00/00/1-0.gif"/>'
    });
  });

我的所有搜索都说spinner选项应该在加载选项卡时显示一个图标,但我从未在这里看到它...

他们似乎已经删除了这个选项？如果是这样,当前在慢速加载面板上显示旋转器的方法是什么？

我正在尝试更改jquery.ui选项卡中选项卡的背景颜色.通常它默认使用颜色.我的代码是

<div id="tabs">
    <ul>
        <li><a href="#1"><span>Home</span></a></li>
        <li><a href="#2"><span>Home</span></a></li>
    </ul>

    <div  id="1">
        <p>MY DATA</p>
    </div>
    <div id="2">
        <p>MY DATA 2nd</p>
    </div>
</div>

<script>
   $( "#tabs" ).tabs();
   $('#tabs').bind('tabsshow', function(event, ui) { 
        $('#tabs').css('background-color', '#231f20');
    });
</script>

提前致谢

我有两个选项卡,每个选项卡上都有一个提交按钮.单击该按钮时,我需要重新加载该特定选项卡的内容以从服务器获取更新的数据.

if (validStatus()) {
    $.ajax({
        //...
        success: reloadTab
    });
}    

function reloadTab() {                
            var currentTab = $("#tabs").tabs("option", "active");
            alert(currentTab);
            $('#tabs').tabs('select', currentTab);
            alert(currentTab);
        }

单击该按钮时,选项卡不会刷新.我看到第一个警报但不是第二个.

HTML如下:

头:

<link rel="stylesheet" href="@this.Url.Content("//code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css")" />
<script>
    $(function () {
        $("#tabs").tabs();
    });
</script>

身体:

<div id="tabs">
<ul>
    <li><a href="#Tab1" title="Tab1">The first tab</a></li>
    <li><a href="#Tab2" title="Tab2">the second tab</a></li>
    <li><a href="#Success" title="Success">Success</a></li>
</ul>

<div id="Success">
    testing
</div>

<div id="Tab1">

    <fieldset >
        <legend>Overview</legend>
        <input type="button" id="submit1" value="submit" />
        <br />
    </fieldset>

    <fieldset style="width: 700px;">
        <legend>Overview</legend>
        <div>
            <table >
            //updated …

有没有办法通过jquery/javascript修改jquery ui中的选项卡的链接？

样本问题就像

标签包含网址 "http://thanksforyourhelp/greatly/appreciated/"

如果在该选项卡上提交表单,则会将数据写入数据库.响应提供添加到数据库的行的ID.

下次访问特定选项卡时,链接实际应该是

'http://thanksforyourhelp/greatly/appreciated/ID' 

现在知道ID,因为表单的响应(这里也是ajax)将其发回.当这个响应出现时,我将重新加载当前选项卡,其中包含ID.

在JQuery 1.10之前.我们可以做这样的事情

$("#tabs").tabs("url", index, url);

我们如何在JQuery UI 1.10+中做到这一点.在JQuery 1.10中删除了URL方法？