2

I want to change the color of the text box in html when on focus. But my color is not changing.!

Html

<!DOCTYPE html>
<html>
 <head>
  <title>Make a new account</title>
   <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
   <script src="script.js" type="text/javascript" ></script>
 </head>
 <body>
  <h2 align="center" class="Heading">Want an account</h2>
  <h3 align="center" class="Heading">Enter your details</h3>
  <div align="center">
   <form name="Info_Form">
    <table>
     <tr>
      <td class="TD">Your Name Pal :</td> <td><input type="text" name="Name"></td>
     </tr>
     <tr>
      <td class="TD">Your Password :</td> <td><input type="password" name="pwd"></td>
     </tr>
     <tr>
      <td align="right" ><input type="submit" value="Submit"></td>
     </tr>
    </table>
   </form>
  </div>
 </body>
</html>

my js file:

$(document).ready(function(){
 $('h2').fadeOut(3000);
 $(".TD").focus(function(){
    $(this).css("background-color","blue");
  });
});

What am i doing wrong?

4

2 に答える 2

2

.focus()これは、限られた数の要素 (リンク、フォーム入力) にしか適用できないためです。

jQueryのドキュメントから：

focus イベントは、要素がフォーカスを取得したときに送信されます。このイベントは、フォーム要素 (、など) やリンク () などの限られた一連の要素に暗黙的に適用されます。最近のブラウザ バージョンでは、要素の tabindex プロパティを明示的に設定することで、イベントを拡張してすべての要素タイプを含めることができます。要素は、Tab キーなどのキーボード コマンドを使用するか、要素をマウスでクリックすることによって、フォーカスを得ることができます。

ここでは、それを<td>タグに適用しようとします。

さらに、あなた<input>は の子ではない.TDため、コードの別の問題です。

これを実現するためにcss:focusセレクターを使用しないのはなぜですか?

于 2013-10-10T09:16:23.363 に答える
2

それ以外の ：

$(".TD").focus(function(){
    $(this).css("background-color","blue");
  });

使用する：

$("input").focus(function(){
    $(this).css("background-color","blue");
  });
于 2013-10-10T09:22:21.580 に答える