4

ページが読み込まれたときに、入力コントロールに焦点を合わせて強調表示(境界線の色または背景色の変更)したいと思います。どうすればいいですか?これは私がこれまでに得たものです。

<script type="text/javascript">
    $(function () {
        $("#txt1").focus();            
    });
</script>
4

3 に答える 3

5

CSS:focusセレクターを見てください。そして、次のようなCSSクラスを指定するだけです。

#txt1:focus {
    border-color:red;
}

古いブラウザ(IE7とその他)ではサポートされていないため。あなたはJSでそれをしたいかもしれません。

$("#txt1").focus(function(){ $(this).addClass("focused")});
$("#txt1").blur(function(){ $(this).removeClass("focused")});    

focusedこのように定義されている場所:

#txt1.focused {
   border-color:red;
}

編集:

Jquery.focusドキュメント。

$("#txt1").focus(function(){ $(this).addClass("focused")});

上記の行は、ハンドラーをフォーカスイベントにバインドするだけで、フォーカスを変更したり、すぐに実行したりすることはありません。ページの読み込みに焦点を当てたフィールドを取得するには、その後に別の行を追加する必要があります。

$("#txt1").focus();

これは、選択した要素にフォーカスを設定し、以前にアタッチされたハンドラーを実行します。短い表記:

$("#txt1").focus(function(){ $(this).addClass("focused")}).focus();

ページの読み込み時に要素が自動化されたデモ

于 2012-11-05T15:38:49.763 に答える
1

あなたが持っているものは要素に焦点を合わせます。:focusCSSの疑似セレクターを使用して、必要に応じて入力のスタイルを設定できます。

#txt1:focus {
    border: 1px solid #C00;
    background: #CCC;
}
于 2012-11-05T15:39:13.160 に答える
0

ここでは、いくつかのcssを使用して、境界線の色、背景色を適用できます。入力に焦点を合わせると色が変わる以下のcssを参照してください

input:focus {
         font-family:Verdana, Geneva, sans-serif;
    border-color:#9ecaed;
    box-shadow:0 0 5px #9ecaed;
}

フォーカスした後、強調したいcss属性を配置します。

于 2012-11-05T15:43:27.500 に答える