javascript - ASP.NET MVC - 更改选项卡 AJAX RenderAction

Question

我是西类牙人，所以我的英语很糟糕。我希望我的下一个解释是清楚的。

此时我有以下代码:

<div id="tabs-1">
    <div id="table-ser1">
        @{Html.RenderAction("Name", "Name2", new {ser ="ser1", s1 = s1, s2 = s2});}
    </div>
</div>

<div id="tabs-2">
    <div id="table-ser2">
        @{Html.RenderAction("Name", "Name2", new {ser ="ser2", s1 = s1, s2 = s2});}
    </div>
</div>

事实是，此时此刻，当页面加载时，所有内容都加载完毕，页面速度非常慢。如何使用 AJAX 更改此设置？我希望当加载页面时，它只加载第一个选项卡的内容，当单击第二个选项卡时，它加载该选项卡的内容。

最后，如果我返回第一个选项卡，由于是第一次，所以必须加载它，而不必再次加载。

谢谢!

Answer 1

jquery ui tabs有一个开箱即用的选项(请参阅链接)。

但是，ajax 加载存在一些问题，快速查看上面的链接，显示仍然存在一些问题(例如，当我单击 tab1 时，它显示选项卡 4，然后快速单击 3，始终显示 3(ajax 选项卡)重新加载)。

我建议您查看beforeActivate事件(或类似事件)

设置每个选项卡，以便它知道它是否已加载，并在激活时加载。

使用简单的 $.ajax 调用或 $("#div").load(...) 来获取内容，例如:

$("#table-ser2").load("@Url.Action("Name", "Name", ... ");