ホームページ > ウェブフロントエンド > jsチュートリアル > jqueryプラグインのconflict_javascriptスキルの問題を解決する

jqueryプラグインのconflict_javascriptスキルの問題を解決する

WBOY
リリース: 2016-05-16 17:02:53
オリジナル
1189 人が閲覧しました

今日は、jquery と jquery プラグイン ライトボックスを使用して、画像の浮動拡大効果を問題なく作成するサンプルを作成しました。

次に、ナビゲーション バーの js を追加しました。構造ナビゲーションの js と画像のフローティングと拡大の js が競合しました。

ナビゲーションバー js のみが有効であるか、イメージフローティング js のみが有効です。

ネットで検索した結果、解決策は次のとおりです

jQuery.noConflict()

概要
この関数を実行して、変数 $ の制御を最初のライブラリに移して実装します。

これは、jQuery が他のライブラリの $object と競合しないようにするのに役立ちます。

この関数を実行した後は、jQuery 変数を使用してのみ jQuery オブジェクトにアクセスできます。たとえば、$("div p") が使用されている場合は、jQuery("div p") に置き換える必要があります。

'''注:''''この関数は、jQuery ファイルをインポートした後、および別のライブラリをインポートする前に使用する必要があります''''。競合が発生する可能性があります。もちろん、jQuery が最後にインポートされたものでない限り、他の競合するライブラリが使用される前にも実行する必要があります。例

説明:
$ で参照されるオブジェクトを元のオブジェクトにマップします。

jQuery コード:
jQuery.noConflict();
// jQuery を使用
jQuery("div p").hide();
// 他のものを使用ライブラリの $()
$("content").style.display = 'none';

説明:
エイリアス $ の使用を復元し、この関数のスコープ内で $ を jQuery のエイリアスとして引き続き使用する関数を作成して実行します。 。この関数では、元の $ オブジェクトは無効です。この関数は、他のライブラリに依存しないほとんどのプラグインで適切に機能します。

jQuery コード:
jQuery.noConflict();
(function($) {
$(function() {
// $ を jQuery エイリアス コードとして使用します
});
})(jQuery);
// $ をエイリアスとして使用する他のライブラリのコード説明:
次のライブラリ オブジェクトで jQuery を使用するための新しいエイリアスを作成します。

jQuery コード:
var j = jQuery.noConflict();
// jQuery ベースのコード
j("div p").hide();
//他のライブラリに基づく $() コード
$("content").style.display = 'none';


jQuery.noConflict();
(function($) {
$(function() {
// $ を jQuery エイリアスとして使用するコード ナビゲーション js を置きます真ん中のコードを書くだけです
});
})(jQuery);
// $ をエイリアスとして使用する他のライブラリのコード

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート