2016-11-11 5 views
-4

が動作していないことは、HTMLコード私JavaScriptがここ

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
    <script src="hello.js"></script> 
    <title>Title</title> 
</head> 
<body> 
    <form action="#"> 
    <p>Name:<input type="text"/></p> 
    <p>Password:<input type="text"/></p> 
    <p><input id= "newsletter_button"type="button" value="CLICK ME"/></p> 

    </form> 

</body> 
</html> 

であり、これには、JavaScriptです:

$(":text").focusin(function() { 
    $(this).css("background-color", "red"); 
}); 
$(":text").blur(function() { 
    $(this).css("background-color", "#fff"); 
}); 

hello.jsとのindex.htmlは、同じファイルです。私はjQueryにいくつか問題があると思います。

+2

を:

また、あなたは

<p><input id= "newsletter_button"type="button" value="CLICK ME"/></p> 

マークアップエラーを持っているタイプの前にスペースを入れてください。あなたは実際に問題が何であるか説明していません。何があなたのために働いていないのですか? –

+3

これはタイトルにとっては本当に悪い選択です。 – trincot

+0

^^と質問があります。 –

答えて

-1

どちらかが</body>前に最後にあなたのhello.jsを置くか、それが何

$(document).ready(function(){ 
$(":text").focusin(function() { 
    $(this).css("background-color", "red"); 
}); 
$(":text").blur(function() { 
    $(this).css("background-color", "#fff"); 
}); 
}); 

でそれをラップしているが、コードいったん全ページがロードされ実行されます。それ以外の場合は、 ":text" DOMオブジェクトがロードされる前に配置すると、DOMオブジェクトが定義されていないというエラーが発生します。私は、コードを実行し、すべての問題が表示されない

<p><input id= "newsletter_button" type="button" value="CLICK ME"/></p>