ページ制作にHTML+CSS+JavaScriptを使用する場合、ユーザーエクスペリエンスに影響を与える小さな詳細に遭遇することが多く、私たちは簡単に無視できます。たとえば、入力入力ボックスのプロンプト情報は、オブジェクトの取得と焦点の損失に基づいて表示および非表示にできます。今日、私はあなたとこのヒントを共有したいと思います、私はあなたがレンガを撃たないことを願っています~~~
1。要件
入力ボックスは、カーソルが表示されると、迅速な情報を隠します。
2。メソッド
1。入力にID名を付け、onfocus = "メソッド名1（this）"、onblur = "メソッド名2（this）"
2。変数値を宣言し、ID名を介して入力を取得します
3。関数メソッド名1（inputobj）{
次のようにコードコードをコピーします。
if（inputobj.value == "..."）{）{
inputobj.value = "";
}
}
4。関数メソッド名2（inputobj）{
次のようにコードコードをコピーします。
if（inputobj.value == "" "）{{
inputobj.value = "..." ;;;
}
}
5。注：同じ設定を必要とする同じページに複数の入力タグがある場合、メソッド名が一貫していません。
第三に、インスタンス
次のようにコードコードをコピーします。
<
<html xmlns = "http://www.w3.org/1999/xhtml">
<head>
<メタhttp-equiv = "content-type" content = "text /html; charset = utf-8" /> />
<Title>非文書</title>
<link href = "file：/// e | /midi/css/index.css" type = "text/css" rel = "styleSheet"/>/>
<script type = "text/javascript">
var value = document.getElementById（ 'shuru'）;
関数Qingkong（inputobj）{{
if（inputobj.value == "あなたの名前を入力してください"）{{
inputobj.value = "";
}
}
function likai（inputobj）{
if（inputobj.value == ''）{
inputobj.value = "名前を入力してください";
}
}
</script>
<style type = "text/css">
/*以下のテキストは、IEブラウザの入力ボックスの背景色を変更できます*/
.search input {star：expression
this.style.backgroundcolor = "＃ff0000"
}、
onmouseout = function（）{
this.style.backgroundcolor = "#ffffff"
}）
}
</style>
</head>
<body>
<入力型= "text" id = "shuru" value = "曲名または歌手名を入力してください
</body>
</html>