ホームページ  >  記事  >  ウェブフロントエンド  >  入力ボックスのプロンプト情報の表示と非表示を制御するメソッド_javascript スキル

入力ボックスのプロンプト情報の表示と非表示を制御するメソッド_javascript スキル

WBOY
WBOYオリジナル
2016-05-16 17:00:212737ブラウズ

html css javascrpt を使用してページを作成する場合、ユーザー エクスペリエンスに影響を及ぼし、見落としがちな小さな詳細に遭遇することがよくあります。たとえば、オブジェクトがフォーカスを取得したりフォーカスを失ったりするのに応じて、入力ボックス内のプロンプト情報を表示または非表示にするにはどうすればよいでしょうか。今日はここにいますので、マスターの皆さんが間違いを犯さないことを願っています~~~

1. 要件

入力ボックスを入力し、プロンプト情報を非表示にします。カーソルが表示されているとき ; カーソルが入力ボックスから離れると、プロンプト メッセージが表示されます。

2. メソッド

1. 入力に ID 名を付けます。Onfocus="メソッド名 1 (この)"、onblur="メソッド名 2 (この)"

2. 変数値を宣言し、ID 名を通じて入力を取得します

3. 関数メソッド名 1 (inputObj){

コードをコピーします> コードは次のとおりです。
if(inputObj.value==”…”){

inputObj.value=””;
}

}


4. 関数メソッド名 2 (inputObj){


if(inputObj.value==””){

inputObj.value="…”;

}

}


5. 注: 同じ設定を必要とする入力タグが同じページに複数ある場合、メソッド名は一貫していません。

3. 例


コードをコピーします コードは次のとおりです:
;html xmlns ="http://www.w3.org/1999/xhtml">


無題ドキュメント

style type="text/css">
/*次のテキストは IE ブラウザの入力ボックスの背景色を変更できます*/
.search input{star :expression(onmouseover =function(){
this.style.backgroundColor="#FF0000"
},
onmouseout=function(){
this.style.backgroundColor="#FFFFFF"
})
}






声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。