人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

jQueryとui.tabs.jsを使って

$(function(){
$('#info-tab>ul').tabs();
});

タブを動かしたいのですが、firebugによると

$.widget is not a function
[Break on this error] destroy: function() {
ui.tabs.js (457 行目)
$("#info-tab>ul").tabs is not a function
[Break on this error] $('#info-tab>ul').tabs();

のようなエラーが出てしまいます。数時間やってみましたが原因がわかりません。
どうしたらよいでしょうか?

●質問者: sulfonamides
●カテゴリ:コンピュータ ウェブ制作
✍キーワード:Firebug jQuery js ON UI
○ 状態 :終了
└ 回答数 : 1/1件

▽最新の回答へ

1 ● rouge_2008
●70ポイント ベストアンサー

ui.tabs.jsという事は、jQueryのバージョンは1.3.2ですか?

ui.tabs.jsの他に、ui.core.jsも必要です。

※次のように、ui.tabs.jsより先にui.core.jsを読み込んでください。

<script type="text/javascript" src="ui/ui.core.js"></script>
<script type="text/javascript" src="ui/ui.tabs.js"></script>

http://jqueryui.com/download

※ダウンロードしたファイルを解凍して、「development-bundle」→「ui」フォルダの中を確認してください。

この中に必要なファイルが入っています。

※上記フォルダ内のjquery-ui-1.7.2.custom.jsあるいは、「js」フォルダ内のjquery-ui-1.7.2.custom.min.jsを使用する場合は、ui.tabs.jsとui.core.jsは必要ありません。


※jQuery 1.4以降用のUIバージョン1.8の場合は、jquery.ui.tabs.jsの他にjquery.ui.core.jsとjquery.ui.widget.jsが必要になります。

記述する順番もUIバージョン1.7.2と同じようにjquery.ui.core.jsとjquery.ui.widget.jsを先に記述して読み込むようにします。

(jquery.ui.core.jsは後に記述しても大丈夫なようですが、一応先に記述して置く方が良いと思います。)

※必要なファイルもjquery-ui-1.8.custom.min.jsあるいはjquery-ui-1.8.custom.jsを使用する場合は、他にはjquery.jsがあれば大丈夫です。


今回のエラーとは関係ありませんが、HTMLの方の構造はどうなっているのでしょうか?

idにinfo-tabを指定した要素の中にulがあって、その中にさらにタブを適用したいulがある場合は以下のように指定しますが、

$('#info-tab>ul').tabs();

idにinfo-tabを指定した要素の中にあるulに適用させたい場合は、以下のように記述するだけで大丈夫です。

$('#info-tab').tabs();
◎質問者からの返答

お!バッチリ動きました!

ご指摘いただいた点+jquery.ui.tabs.jsをダウンロードしたものに差し替える でうまく行ったようです。

バージョンが違ったのかな?

ありがとうございました。

関連質問


●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ