web-dev-qa-db-ja.com

Microsoft JScriptランタイムエラー：タブウィジェットインスタンスに対してそのようなメソッド 'select'はありません

HTMLボタンをクリックしたときのjqueryタブのselect特定のタブ機能が必要です。 _jquery.1.9.1.js_および_jquery-ui-1.10.2.custom.js_ファイルを使用しています。以下のコードを実装しましたが、機能しません。

_<script language="javascript" type="text/javascript">
 $("#ui-tabs").tabs();
 function SelectTab() { // bind click event to link
                 $('#ui-tabs').tabs('select', 2); // switch to third tab
                 return false;
             }
 </script>
<div id="ui-tabs">
<ul>
    <li><a href="#tabs-1">Nunc tincidunt</a></li>
    <li><a href="#tabs-2">Proin dolor</a></li>
    <li><a href="#tabs-3">Aenean lacinia</a></li>
</ul>
<div id="tabs-1">Tab1 content </div>
<div id="tabs-2">Tab2 content </div>
<div id="tabs-3">Tab3 content </div>
</div><a id="next" class="button-style" href="#" onclick="return SelectTab();">Select Tab</a>
_

問題は、関数SelectTabのステートメント$('#ui-tabs').tabs('select', 2);でエラー_Microsoft JScript runtime error: no such method 'select' for tabs widget instance_が発生することです。タブをクリックすると通常の選​​択が正常に機能します。ただし、関数呼び出しから実行すると機能しません。実装で何が問題になっているのですか、またはファイルが不足していますか？提案してください。

jqueryjquery-uijquery-tabs
17
Rajaram Shelar

このバージョンでは、jQuery UIタブにselectメソッドはありません。機能を動作させるには、コードを次のように変更する必要があります。

$('#ui-tabs').tabs( "option", "active", 2 );

これについての詳細は http://api.jqueryui.com/tabs/#option-active を参照してください。

// getter
var active = $( ".selector" ).tabs( "option", "active" );

// setter
$( ".selector" ).tabs( "option", "active", 1 );

動作する例については、この小さな jsFiddle をチェックしてください。

49
Tim B James

サイトで開いているタブに個別のリンクを作成する場合は、以下の関数を使用して、

<div onclick="changeToTab(targetTabNumber)"> mylinkText </div>

function changeToTab(ID){
    var $tabs = $('#tabs').tabs();
    $tabs.tabs( "option", "active", ID );
    return false;
}

最初のターゲットは0、2番目のターゲットは1と続きます。もちろん、divは、onclickを許可するものであれば何でもかまいません。

0
Max