KENDO TABSTRIP：在选择选项卡时，调用选项卡内容的JavaScript函数答案

【问题标题】：Kendo Tabstrip: Call tab content's javascript function whenever a tab is selectedKENDO TABSTRIP：在选择选项卡时，调用选项卡内容的JavaScript函数
【发布时间】：2016-04-07 02:28:16
【问题描述】：

我有一个剑道标签，有多个标签内容，每个都包含Javascript函数$(document).ready()...

但是，它仅在第一次选择选项卡时执行（已加载内容），当我选择另一个选项卡并返回此选项卡时，由于内容已加载，$(document).ready() 不会被调用。

有什么方法可以让$(document).ready()在每次选择选项卡时执行？（由于性能考虑，每次都重新渲染选项卡内容不是一个选项......）

欢迎提出任何建议！

【问题讨论】：

标签： c# asp.net-mvc-4 kendo-asp.net-mvc

【解决方案1】：

您可以为每个单独的选项卡定义一个函数，并使用some of the available events 连接一个客户端事件以在 TabStrip 选择更改时接收：

@Html.Kendo().TabStrip()
            .Name("YourTabStrip")
            .Events(events => events.Select("tabChanged"))

<script>
    function tabChanged(e){
        // Get your selected tab using (e.item);
        var index = $("#YourTabStrip").data("kendoTabStrip").select().index();

        // Based on the tab, trigger a function
        switch(index){
            default:
            case 0:
                LoadContentA();
            case 1:
                LoadContentB();
        }
    }
</script>

您可以在各个选项卡中重构每个 $(document).ready() 调用，以简单地调用 switch 语句中指定的函数之一：

<script>
    $(document).ready(function(){
        LoadContentA();
    });

    function LoadContentA(){
        // Do work here
    }
</script>

我敢肯定，如果您通读 available Javascript API documentation 和 ASP.NET MVC API documentation，它可能有助于提供一些额外的见解，以更好地解决这个问题。

【讨论】：