如何使用 Jquery UI Tabs 构造方法？答案

【问题标题】：How do I use Jquery UI Tabs constructor methods?如何使用 Jquery UI Tabs 构造方法？
【发布时间】：2009-07-21 10:55:46
【问题描述】：

我正在使用 Asp.net MVC，并且我一直在尝试在 jquery 中使用 Ajax UI 选项卡。

在演示网站上：http://jqueryui.com/demos/tabs/#ajax

有这个

通过 Ajax 获取外部内容通过在选项卡中设置 href 值选项卡链接。而 Ajax 请求正在等待回复，选项卡标签更改为“正在加载...”，然后返回正常标签一次已加载。

我从未在他们的演示中看到标签更改为加载。所以我决定尝试制作自己的示例。在我的 asp.net mvc 应用程序中，我将 href 设置为加载部分视图的操作视图。在这个动作视图中，我放置了一个“5000”的睡眠线程。

然而，我从未见过他们谈论的这种“正在加载......”，即使我放慢了请求和检查的速度。

然后我正在查看构造函数方法，但我不知道如何使用它们，例如我正在查看它具有的微调器选项

微调器

类型：字符串默认值： '加载中……'

这个字符串的 HTML 内容是远程显示在选项卡标题中内容正在加载。传入空字符串以停用该行为。代码示例

使用微调器初始化选项卡指定选项。
$('.selector').tabs({ spinner: 'Retrieving data...' });
获取或设置微调器选项，之后初始化。
//getter
var spinner = $('.selector').tabs('option',
'微调器'); //二传手 $('.selector').tabs('option', 'spinner', '正在检索数据...');

所以我按照我所说的做了，我把那行放在我的 jquery 中，并将其更改为我拥有的真实 div。

我也没有看到这个微调器，所以我不知道我错过了什么。我需要做点别的吗？

我的 JavaScript 代码：

<script src="../../Scripts/jquery-1.3.2.min.js" type="text/javascript"></script>
<link href="../../images/jquery-ui-1.7.2.custom.css" rel="stylesheet" type="text/css" />

<script src="../../Scripts/jquery-ui-1.7.2.custom.min.js" type="text/javascript"></script>


    <script type="text/javascript">
        $(function() {

            // Tabs
        $('#tabs').tabs({ spinner: 'Retrieving data...' });


        });
        </script>

编辑

感谢“redSquares”帖子，我现在知道为什么我的不工作但我使用 Html.ActionLink。那么如何形成我的 Html.ActionLink 以具有 span 标签？还是我必须自己制作 Html 助手？

【问题讨论】：

这是一个新问题:) 最好接受这个答案并提出一个新问题。帮助搜索本网站和通过谷歌搜索的人找到正确的信息
但要回答下一个问题，请查看stackoverflow.com/questions/402605/…

标签： jquery asp.net-mvc jquery-ui

【解决方案1】：

您需要将该微调器部分放在您第一次启动选项卡的任何位置，可能在您的文档就绪功能中。将 { spinner: 'Retrieving data...' } 放入 tabs.tabs(x) 中。

大多数时候它会加载得如此之快，以至于你看不到它，这是一个很好的问题。

您可以在sneakyness.com，我当前的项目中看到一个这样的例子

【讨论】：

【解决方案2】：

您需要在锚点内放置一个跨度。很好的文档解释了这一点！

例如

<ul>
  <li><span><a href="someUrl"><span>Spinner Needs this</span></a></li>
  <li><a href="shomeUrl1"><span>Spinner Needs this</span></a></li>      
</ul>

演示here

【讨论】：