3

アプリケーションに Kendo-ui タブ ストリップがあり、次のように構成に関連するすべてのアニメーションを無効にしました。

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

これは、タブを開いているときに正常に機能しており、アニメーションはまったくありません。しかし、次のようにselectメソッドを使用してコードからタブを開くと、問題が発生します。

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

タブストリップのデフォルトのアニメーションだと思うので、タブを開くときにアニメーションを表示しています。それも無効にしたい。やり方がわかる方いましたら回答お願いします。

ありがとう。

4

2 に答える 2

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.c​​om/api/web/tabstrip#methods-activateTab

于 2013-10-18T05:09:48.243 に答える
0

これは正しく明確な答えです。しかし、私の場合はそうではありませんでした。select() でも問題なく動作しています。私のコードの欠点は、別の方法を使用してタブ項目を選択したことです。これは、コードを単純化するために上に示していません。私の実際のアプリケーションでは、次のようでした

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

そのため、select メソッド内でこのメソッドを呼び出して、タブ項目を選択していました。その方法ではkendoTabStrip()を使用してタブ ストリップを取得していました。これは、タブ ストリップを再初期化してアニメーションをドロップしていると思われるためです。最初に行ったfalse設定。タブストリップを既に初期化していたので、その部分を削除したところ、期待どおりに動作し始めました。とにかくあなたの答えは正しい答えであり、これは完全に私のせいです。この投稿は、この種の問題に直面している他の人にとって役立つと思います。

于 2013-10-20T22:10:33.340 に答える