JavaScriptを使用してjqueryがロードされているかどうかの確認


176

JQueryライブラリがHTMLページに読み込まれているかどうかを確認しようとしています。動作するか確認していますが、おかしいです。ここに私が持っているものがあります:

<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <script type="text/javascript" src="/query-1.6.3.min.js"></script>
        <script type="text/javascript">
          $(document).ready(function(){
             if (jQuery) {  
               // jQuery is loaded  
               alert("Yeah!");
             } else {
               // jQuery is not loaded
               alert("Doesn't Work");
             }
          });
        </script>

3
「$(document).Ready」では大文字のRを使用しないでください
Serigan '29

7
alert(window.$?1:0)
Thielicious 2017

なぜ古いxhtml標準をまだ使用しているのですか?ただ使う<!doctype html>代わりに
ルークオタク

場合$(document)レディ機能がすべてで動作し、その後、jqueryのロードされます。したがって$(document).ready(function(){ alert("Ready!"); }); 、Grantedを実行するだけで済みます。jqueryの実行に失敗した場合、アラートは表示されません。しかし、jqueryライブラリを正しく参照していることを確認するだけの場合はそれで十分です。
ToolmakerSteve

回答:


338

何かがおかしい

さて、あなたはjQueryを使用してjQueryの存在を確認しています。jQueryがロードされていない場合$()、別のライブラリを使用していて、そのライブラリが偶然同じ$()構文を共有していない限り、コールバックはまったく実行されず、コールバックも実行されません。

あなたを削除します$(document).ready()window.onload代わりに何かを使用してください):

window.onload = function() {
    if (window.jQuery) {  
        // jQuery is loaded  
        alert("Yeah!");
    } else {
        // jQuery is not loaded
        alert("Doesn't Work");
    }
}

1
jQueryが未定義の場合でも、これはそのままエラーをスローします。をチェックする必要がありwindow.jQueryます。
gilly3 2011

@ gilly3:ああ、厄介なスコープの問題。修繕。
BoltClock

HTMLファイルと同じディレクトリにjquery-1.6.3.min.jsファイルがあります。読み込まれない理由がわかりません。
SoftwareSavant

3
@DmainEvent:どちらもルートディレクトリにありますか?あなたsrcがリードしている/、それはそれが根を探していることを意味します。
BoltClock

実は違う。それを変えてみよう。
SoftwareSavant

46

このリンクに従って:

if (typeof jQuery == 'undefined') {
    // jQuery IS NOT loaded, do stuff here.
}


リンクのコメントにもいくつかあります。

if (typeof jQuery == 'function') {...}

//or

if (typeof $== 'function') {...}

// or

if (jQuery) {
    alert("jquery is loaded");
} else {
    alert("Not loaded");
}


これがこのことを成し遂げるための良い方法のほとんどをカバーしてくれることを願っています!!


2
@JakeN一定の時間が経過すると、投稿が編集されない限り、反対票を取り消すことはできません。ただし、この投稿には1つの問題がありif (jQuery) {ます。jQueryが読み込まれていない場合、strictモードでエラーがスローされるため、最後のコードスニペットは不適切な提案です。
JLRishe 2017年

21
if ('undefined' == typeof window.jQuery) {
    // jQuery not present
} else {
    // jQuery present
}

15

これは、ウェブページを検査するときに、コンソールタブですばやく実行できます。

例えば:

$ === jQuery

返されたtrue場合は、読み込まれていることを意味します。


:jQueryのがロードされていない場合、これはかかわらず、例外が発生しますUncaught ReferenceError: jQuery is not defined
Batkins

10

実際に問題を解決する可能性があるほんの小さな変更:

window.onload = function() {
   if (window.jQuery) {  
       // jQuery is loaded  
       alert("Yeah!");
   } else {
    location.reload();
   }
}

$(document).Ready(function()使用する代わりにwindow.onload = function()


1

jQueryが非同期で読み込まれる場合は、定義されるまで待機し、一定期間ごとにチェックすることができます。

(function() {
    var a = setInterval( function() {
        if ( typeof window.jQuery === 'undefined' ) {
            return;
        }
        clearInterval( a );

        console.log( 'jQuery is loaded' ); // call your function with jQuery instead of this
    }, 500 );
})();

このメソッドは任意の変数に使用でき、出現するのを待っています。


-2

window.jQueryコンソールに入力するだけ です。function(e、n)が返された場合... jqueryが読み込まれ、正常に動作していることを確認します。


-4

簡単な方法は、開発者コンソールでjQueryコマンドを実行することです。任意のブラウザでF12を押し、任意の要素にアクセスしてみます。

 $("#sideTab2").css("background-color", "yellow");

ここに画像の説明を入力してください

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.