ホームページ > 記事 > ウェブフロントエンド > Bootstrap+jqueryファイル導入エラー
今回はbootstrap+jqueryファイル導入時に報告される注意事項を紹介します。実際の事例を見てみましょう。
プロジェクトに取り組んでいると、常にさまざまなバグがコンソールに表示されますが、開発中にエラーが発生するたびにパニックになる必要はありません。要約するのが得意です。次回見たときに修正します。以下に、開発プロセス中に何が起こっているのかを要約します。エラー 1: キャッチされない参照エラー: $ が定義されていません
Uncaught ReferenceError: $ is not defined Uncaught ReferenceError: jQuery is not definedエラーの理由: ファイルをロードする順序が間違っています。jQuery ファイルの順序が前にある必要があります 方法:すべてのスクリプト ファイルの前に jQuery ファイルを記述しますが jsp ページに変更され、パスが見つかりません。 さて、次のようになります 現時点では、このコードをファイルに追加するだけです:
解決策: 次のコードを間に挿入します。 と
<% String path = request.getRequestURI(); String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path; %> <base href="<%=basePath%>" rel="external nofollow" >
エラー 3: Uncaught TypeError: $(...).tooltip は関数ではありません
Uncaught TypeError: $(...).tooltip is not a function at HTMLDocument.<anonymous> (app.js:42) at l (jquery.min.js:4) at Object.fireWith [as resolveWith] (jquery.min.js:4) at Function.ready (jquery.min.js:4) at HTMLDocument.S (jquery.min.js:4)
理由: jQuery UI の 2 つの異なるバージョンが含まれています。これにより競合が発生する可能性があります。
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>Solution:
Edit:<script>
jQuery( document ).ready(function( $ ) {
$('.hasTooltip').tooltip();
});
</script>
を削除してみてください。このように使用すると、問題が解決しました。
エラー 4: キャッチされない TypeError: $(...).sortable は関数ではありません
Uncaught TypeError: $(...).sortable is not a function at HTMLDocument.<anonymous> (dashboard.js:12) at l (VM552 jquery.min.js:4) at Object.fireWith [as resolveWith] (VM552 jquery.min.js:4) at Function.ready (VM552 jquery.min.js:4) at HTMLDocument.S (VM552 jquery.min.js:4)
エラー 5: bootstrap.min.js:7 キャッチされないエラー: ブートストラップには jQuery が必要です
bootstrap.min.js:7 Uncaught Error: Bootstrap requires jQuery at bootstrap.min.js:7
解決策: 解決策: jquery.min.js を bootstrap.min.js ファイルの前に置き、それを参照します。 bootstrap.min.css ファイルが 2 つのファイルの前で参照されるか後ろで参照されるかは関係ありません (複数回テストされています)。 )。
この記事の事例を読んだ後、あなたはその方法をマスターしたと思います。さらに興味深い情報については、php 中国語 Web サイトの他の関連記事に注目してください。
推奨読書: jquery で ajax をリクエストし、サーブレットで ajax を応答するスタートアップ ページでデータを即座にロードする jquery を実現する
入力ボックスとドロップダウン ボックスの連携効果を実現する以上がBootstrap+jqueryファイル導入エラーの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。