jQuery が動作しません。

Question

jQueryプラグインである、Multifilter　を使いたいと思ってます（http://tommyp.github.io/multifilter/）。はてなブログを使用しており、以下のように導入しても動作しません。

はてなブログhead要素に以下を
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1 …

本文には以下を書き込んでます。
<script type="text/javascript" src="http://www.googledrive.com/host/...../"></script>
<script type="text/javascript">
(function($){
$(document).ready(function() {
$('.filter').multifilter()
})
}(jQuery));
</script>

Multifilter プラグインは google drive 上にホスティングしています。

safari上で以下のエラーが出てしまいます。
TypeError: undefined is not a function (evaluating '$('.filter').multifilter()')

is not a function と出てますので、ホスティングがうまくいってないのかとも思ったのですが、ページのソースを見たところ、スクリプトは読み込まれているようでした。

jsやjqueryはあまりいじったことなく、にっちもさっちいかない状態です。
よろしくお願いします。

fujillin · Accepted Answer

ANo3です。

どうやら、ANo4様のご指摘の通りのようですね。
Multifilterが初期設定をした後に、jQueryの再読み込みで上書きされてしまっているのが原因と思われます。

ANo4様がご呈示のリンク先に対処法が記されていますが、同様にMultifilter自体の初期設定も遅らせて行う必要がありますね。
jQueryの再読込み後に、Multifilterを読込む必要がありますので、スクリプトから追加読込みを行う（script要素を作成）ようにするか、Multifilter本体を関数化するなどしておいて、実行のタイミングを遅らせてあげるなどの必要がありそうです。

weakweak · Answer

はてなブログ固有の問題ではないでしょうか？ http://rochefort.hatenablog.com/entry/2013/12/10/230336
jquery本体も、head内ではなくbodyの下の方で、

script src="jquery.js"
script src="multifilter.js"
script src="自分のスクリプト"

の順に読み込んでみるといかがですか？

fujillin · Answer

ANo2です。

＞読み込めてることも確認しました。
あらら・・・　やっかいですね。

次に思いつくのは、ANo1でもあげたバインドの問題。
safari5.1からは対応しているようですが、試みとして、以下のサイトにあるバインドを定義する方法で対応可能かも知れません。
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/bind

それでもダメな場合は、いよいよ、エラーの発生個所を特定して対処するということになってしまうかな・・・

fujillin · Answer

safariを知らないので、かなりの推測まじりですが・・・

エラーメッセージからすると、質問者様と同じことを考えますが、
＞ページのソースを見たところ、スクリプトは読み込まれているようでした。
ページのソースでは、読み込まれているかはわからないのでは？
デバッグツールなどでDOMの内容を確認なさって、読み込めているということでしょうか？

ひとつのテストとして、読込後に
　alert($().multifilter);
などとしてみて、

function (options) {
　"use strict";
　　　var settings = $.extend( {
　　　　'target'        : $('table'),
　　　　'method'    : 'thead' // This can be thead or class
　　　}, options);
　　　・・・　以下省略　・・・

が表示されれば、きちんとjQueryに拡張されていることが確認できるはずです。
されない場合は、
　1）JSファイルが読み込まれていない。
　2）読み込めているが、スクリプト実行中にエラーを起している
が考えられます。
もう少し切り分けて、問題がどこにありそうかを調査なさるのが第一歩かと。

検索してみると、『safariの場合に"TypeError: ‘undefined’ is not a function"が出る』というものが数多く見つかります。
イベントのバインドに関するものが大半のようですが、以下あたりが多少は関係あるかも。
　http://d.hatena.ne.jp/kkotaro0111/20120819/1345361487
　http://www.crossl.net/blog/jquery_click_function_safari_error/

2番目を見ると、safariを最新版にすることで、対応可能かもしれませんね。
　…って、それじゃ回答になってないじゃん（苦笑）

fufufunofufufu · Answer

$('.filter').multifilter()　とその次の行の　})　の；が抜けてるのも気になりますが。

>TypeError: undefined is not a function (evaluating '$('.filter').multifilter()')
はmultifilterの関数がエラーってことだと思うのですが、multifilter.min.js自体はどこで読み込んでるのですか？見た感じ記述ないですよね？

jQuery が動作しません。

ANo3です。

はてなブログ固有の問題ではないでしょうか？

ANo2です。

safariを知らないので、かなりの推測まじりですが・・・

$('.filter').multifilter() とその次の行の }) の；が抜けてるのも気になりますが。

似たような質問が見つかりました

関連するカテゴリからQ&Aを探す

デイリーランキングこのカテゴリの人気デイリーQ&Aランキング

マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング

$('.filter').multifilter()　とその次の行の　})　の；が抜けてるのも気になりますが。