Question

我正在使用Kendo UI MVC，我在acshtml页面上有一个kendoTabStrip。默认情况下，我选择页面加载时的第一个选项卡。使用AJAX动态加载所有其他选项卡。问题：我正在尝试找到所选标签，以便找到它的孩子？查找活动选项卡的一种方法是通过调用不带参数的select（）方法，或者另一种方法是检查classname'k-state-active'但是两种方法都不起作用

<section class="tpt-tabstrip">
    @(Html.Kendo().TabStrip()
    .Name("MyTabStrip")    
    .Animation(false)    
    .Items(items =>
    {
        foreach (var revision in Model.MyCollection)
        {
            items.Add()
            .Text(revision.Name)
            .LoadContentFrom("MyActionMethod", "MyController", Model.ID);
        }
    })
    )    
</section>
<script src="~/Scripts/MyScript.js"></script>

请注意，上面的cshtml中脚本标记位于页面的末尾以下是脚本代码

$(function(){       
    var tabStrip = $("#MyTabStrip").getKendoTabStrip();
    if (tabStrip != null && tabStrip.tabGroup.length > 0) {
        tabStrip.select(0); // this line is getting executed for sure
    }

    // the line below returns -1 here why?????
    var index = tabStrip.select().index(); 

    // another way to find active tab is by checkikng class name 'k-state-active' however it didnt work either. 
    // jQuery couldnt find any element with class 'k-state-active'
    $('.k-state-active')
})

UPDATE1
tabstrip的activate事件对我来说不起作用，因为每次我选择tab都会触发它。我需要一个只被触发一次的事件。最终，我想在选定的选项卡上找到NumericTextBox控件，并将“更改”事件处理程序附加到这些控件。如下所示

$(function(){
    var tabStrip = $('#MyTabStrip').data("kendoTabStrip");
    tabStrip.bind('activate', function (e) {
       $('[data-role="numerictextbox"]').each(function(){
           $(this).getKendoNumericTextBox().bind("change",function(e){
              alert('changed');
        })
       })
    });
})

这里每当我选择标签

时，更改事件处理程序将附加到NumericTextBox

Answer 1

$（＆＃39; .k-state-active＆＃39;）工作正常，它将从DOM返回两个元素。您正试图在$（document）.ready中选择元素，这就是您没有获得元素的原因，因为标签控件尚未呈现。

尝试编写代码 onActivate 事件的kendo标签条控件。在选项卡可见并且其动画完成后触发 OnActivate 事件。在2014年第二季度之前，此事件在标签显示后调用，但在动画结束之前调用。仅对具有关联内容的选项卡触发此事件。请点击http://docs.telerik.com/kendo-ui/api/javascript/ui/tabstrip#events-activate

了解更多信息

第一个标签名称

Microsoft.Azure.Devices.Client

第二个标签内容

<li class="k-item k-state-default k-first k-tab-on-top k-state-active" role="tab" aria-controls="RoleTabs-1" style="" aria-selected="true">
<span class="k-loading k-complete k-progress"></span>
<a class="k-link">Tab Name</a>

如何在页面加载时在KendoTabStrip上找到所选标签？

1 个答案: