javascript - Uncaught ReferenceError $ が定義されていません

Question

私は JavaScript を初めて使用します (数時間前に開始し、スクリプトを機能させようとしています)。W3 に関するいくつかのチュートリアルを実行し、「hello world」コードを HTML に直接貼り付けると機能しますが、スクリプトに問題があります (他のスクリプトにも問題がありましたが、よくわかりません)私が間違っていること）。

HTMLでテストしたいこのコードedit.jsがあり、HTMLをコピーしましたが、同じように見えます。次に、静的フォルダーにファイルを作成し、JavaScriptをコピーしました（示されているとおり）。ページでエラーは発生しませんでしたが、クリックしても何も起こりません。W3の「hello world」コードを貼り付けようとしましたが、うまくいきましたが、このスクリプトはうまくいきません。

Chrome でコードを検査しようとしましたが、そこに上記のエラーが表示されます ([リソース] タブの下)。Chromeを使用してjsファイルを開くことができます。これにより、jsファイルにアクセスでき、正しく指していると思いますが、どのように機能させるかわかりません。HTMLをレンダリングするためのテンプレートエンジンとしてJinja2を使用しています。ヘッダーには次のものがあります。

<script language="JavaScript" type="text/javascript" src="static/edit.js"></script>

そして私のメインテンプレート（すべてのページでレンダリングされるもの）には次のものがあります：

<script language="JavaScript"  src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>

edit.js:

（使用したいページのスクリプトタグ内に直接配置しても機能しません）

$('#editvalue').click(function(e){$('#storedvalue').hide();$('#altervalue').show();});
$('#savevalue').click(function(e){
   var showNew = $('#changevalue').val();
   $('#altervalue').hide();
   $('#storedvalue').show();
   $('#storedvalue span').text(showNew);
});

HTML:

(大きなページに埋め込まれています)

    <head>
        <script language="JavaScript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
        <script language="JavaScript" type="text/javascript" src="static/edit.js"></script>
    </head>
... my html code..
        <div id="wrapper">
           <div id="container">
              <div id="storedvalue"><span>Hello</span> [<a href="javascript:void(0);" id="editvalue">edit</a>]</div>
              <div id="altervalue" style="display:none;"><input type="text" name="changevalue" id="changevalue" value="Hello"> [<a href="javascript:void(0);" id="savevalue">save</a>]</div>
           </div>
        </div>

まだ W3 にない JavaScript を正常に実行できたことはありません。他のスクリプトでも同じ問題が発生しますが、オンラインで問題なく動作していると言っている人がいます。これを機能させるために何か特別なことをする必要がありますか?

私の2つの質問は次のとおりです。

私は何を間違っていますか？
Javascript は問題が発生したときに機能しないように見えるため、エラーや実際の問題に関する情報を取得する方法はありますか?

Uncaught ReferenceError: $ is not defined?を読みました。過去1時間これを理解しようとしてきましたが、私の問題がわかりません。

score 3 · Accepted Answer

まず、最初に jQuery スクリプトタグを配置する必要があります。

次に、次のいずれかを行う必要があります。

この関数内にコードを配置します。
```
$(document).ready(function(){/*CODE HERE*/});
```
またはこのように：
```
$(function(){
    /*CODE HERE*/
});
```

DOM は、使用する前に準備ができている必要があります。DOM の ready イベントで実行される無名関数内にコードを配置することで、これを行うことができます。

編集：

$(function(){
   $('#editvalue').click(function(e){$('#storedvalue').hide();$('#altervalue').show();});
   $('#savevalue').click(function(e){
     var showNew = $('#changevalue').val();
     $('#altervalue').hide();
     $('#storedvalue').show();
     $('#storedvalue span').text(showNew);
   });
});

score 3 · Accepted Answer

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>

jQuery のスクリプトタグは、カスタム JavaScript の前に配置する必要があります。

フォローするedit.js

<script type="text/javascript" src="static/edit.js"></script>

score 2 · Accepted Answer

2

language 属性を削除してみてください。今は時代遅れです..私は思う

于 2012-07-10T03:35:02.360 に答える

score 0 · Accepted Answer

0

使用する前に jquery を含める必要があります。

于 2012-07-10T01:50:45.037 に答える

javascript - Uncaught ReferenceError $ が定義されていません

4 に答える 4

Related

Reference