При использовании HTML+CSS+JavaScript для производства страниц мы часто сталкиваемся с небольшими деталями, которые влияют на пользовательский опыт и легко игнорируются нами. Например, информация о приглашении в поле ввода может быть отображена и скрыта на основе получения объекта и потери фокуса. Сегодня я хочу поделиться с вами этими советами, надеюсь, вы не будете стрелять в кирпичи ~~~
1. Требование
Входная входная коробка, когда отображается курсор, скрывает информацию о приглашении;
2. Метод
1. Дайте имя идентификатора на вход, onfocus = "Имя метода 1 (это)", onblur = "Имя метода 2 (это)"
2. Объявите значение переменной, получите ввод через имя идентификатора
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">
<голова>
<meta http-equiv = "content-type" content = "text /html; charset = utf-8" /> />
<Title> не -title Document </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 = "";
}
}
Функция likai (inputobj) {
if (inputobj.value == '') {
inputobj.value = "Пожалуйста, введите свое имя";
}
}
</script>
<Стиль типа = "text/css">
/*Текст ниже может изменить цвет фона блока ввода в браузере IE*/
.search Input {Star: выражение
this.style.backgroundcolor = "#ff0000"
},
onmouseout = function () {
This.style.backgroundcolor = "#ffffff"
})
}
</style>
</head>
<тело>
<input type = "text" id = "shuru" value = "Пожалуйста, введите имя песни или имя певца" onfocus = "Qingkong (this)" onblur = "likai (this)"/>
</body>
</html>