web-dev-qa-db-ja.com

jQueryキーアップ関数が機能しませんか?

私のHTMLファイル:

<html>
<head>
  <script type="text/javascript" src="js/jquery-1.10.2.min.js"></script>
  <script type="text/javascript" src="js/scripts.js"></script>
  <link rel="stylesheet" type="text/css" href="style.css" />
  <title>
    Login
  </title>
</head>
<body>
<div class=loginForm>
  <p>Worker-ID:<input type=text id=workerID name=workerID /></p>
  <p>Password:<input type=password  id=workerPassword name=workerPassword /></p>
  <input type=submit id=submitLogin name=submitLogin value="Log in"/>
</div>
</body>
</html>

私のscripts.js:

$('#workerID').keyup(function() {
    alert('key up');
);

まったく機能しません。スペース、文字、数字をすべて試しました。アラートは表示されません。間違いはどこですか?

7
adiii4

あなたの行方不明の周りのタイプミスとは別に}、あなたのscript.jsファイルが実行されます(<head>セクション)、ドキュメントの残りの部分は存在しません。これを回避する最も簡単な方法は、スクリプトをドキュメント準備ハンドラでラップすることです。たとえば、

jQuery(function($) {
    $('#workerID').on('keyup', function() {
        alert('key up');
    });
});

または、スクリプトをドキュメントの下部に移動することもできます。

        <script src="js/scripts.js"></script>
    </body>
</html>

または、イベントを親要素(またはドキュメント)にバインドできるイベント委任を使用します。例:

$(document).on('keyup', '#workerID', function() {
    alert('key up');
});
26
Phil

関数を閉じるための中括弧がありません:

$('#workerID').keyup(function() {
    alert('key up');
});

このようなエラーは通常、ブラウザのJavaScriptコンソールに表示されます。

3

hTMLで

挿入ID、名前、_" "内の値

<div class="loginForm">
  <p>Worker-ID:<input type="text" id="workerID" name="workerID" /></p>
  <p>Password:<input type="password"  id="workerPassword" name="workerPassword" /></p>
  <input type="submit" id="submitLogin" name="submitLogin" value="Log in"/>
</div>

jsで

$('#workerID').keyup(function() {
       alert('key up');} // here you forget "}"
      );

demo

1
Rituraj ratan

構文が間違っている ここを参照

$( document ).ready(function() {
   $( "#workerID" ).keyup(function() {
    .....................
   });
});

変化する );から});

0
PSR