Question

我的应用程序中有一个Kendo-ui标签条，我已禁用与该配置相关的所有动画，如下所示。

$("#tabStrip").kendoTabStrip({
    animation: false
});

当我打开标签时，这工作正常，根本没有动画。但是当我使用select方法通过代码打开选项卡时问题就出现了。

var tabStrip = $("#tabStrip").data("kendoTabStrip");
tabStrip.select(tabStrip.tabGroup.children("li").eq(1));

打开选项卡时显示动画，因为我猜它是标签条的默认动画。我也想禁用它。如果您对如何操作有所了解，请回答。

感谢。

Answer 1

不要使用select，而是使用activateTab，如此：

HTML：

<div id="tabstrip">
    <ul>
        <li class="k-state-active">Tab 1</li>
        <li>Tab 2</li>
    </ul>
    <div>Content 1</div>
    <div>Content 2</div>
</div>
<a class="activate" href="#">Activate Tab 2</a>

CSS：

.activate {
    margin-top: 50px;
    float: left;
}

JS：

var $tabs = $("#tabstrip");

$tabs.kendoTabStrip({
    animation: false
});

$(".activate").on("click", function () {
    $tabs.data("kendoTabStrip")
        .activateTab($tabs.find(">ul>li:eq(1)"));

    return false;
});

在这里工作小提琴：http://jsfiddle.net/GaHaG/3/

文档：http://docs.kendoui.com/api/web/tabstrip#methods-activateTab

Answer 2

这是一个正确而明确的答案。但就我而言，事实并非如此。它也适用于select（）。我的代码中出现的错误是我使用了一种不同的方法来选择标签项，我上面没有显示这些方法来简化代码。在我的实际应用程序中它就像

var getTabItem=function(target, index){
    var tabStrip = $(target).kendoTabStrip().data("kendoTabStrip");
    return tabStrip.tabGroup.children("li").eq(index)
}

所以我在select方法中调用此方法来获取选项卡项。在那个方法中，我使用 kendoTabStrip（）来获取标签条，因为我认为它正在重新初始化标签条并放下动画：false 设置我是最初完成。我删除了那部分，因为我已经初始化了标签条，然后它开始按预期运行。无论如何，你的回答是正确答案，这完全是我的错。感谢您的帮助，我认为这篇文章对面临此类问题的其他人有所帮助。

使用select（tab）选择kendo-ui选项卡时如何禁用动画

2 个答案: