عند استخدام HTML+CSS+JavaScript لإنتاج الصفحة ، غالبًا ما نواجه تفاصيل صغيرة تؤثر على تجربة المستخدم ويمكن تجاهلها بسهولة. على سبيل المثال ، يمكن عرض معلومات المطالبة في مربع الإدخال وإخفائها بناءً على الحصول على الكائن وفقدان التركيز. اليوم ، أريد أن أشارككم هذه النصائح ، آمل ألا تطلق النار على الطوب ~~~
1. الشرط
مربع الإدخال ، عند عرض المؤشر ، يخفي معلومات المطالبة ؛
2. الطريقة
1. أعط اسم المعرف للإدخال ، onfocus = "اسم الطريقة 1 (هذا)" ، onblur = "method name 2 (this)"
2. إعلان القيمة المتغيرة ، احصل على الإدخال من خلال اسم المعرف
3. اسم طريقة الوظيفة 1 (inpectobj) {
نسخ رمز رمز على النحو التالي:
if (inpectobj.value == "...") {) {
inpectobj.value = "" ؛
}
}
4. اسم طريقة الوظيفة 2 (inpectobj) {
نسخ رمز رمز على النحو التالي:
if (inpectobj.value == "" ") {{
inpectobj.value = "..." ؛؛؛
}
}
5. ملاحظة: إذا كانت هناك علامات إدخال متعددة في نفس الصفحة التي تتطلب نفس الإعداد ، فلن يكون اسم الطريقة متسقًا.
ثالثًا ، مثال
نسخ رمز رمز على النحو التالي:
<!
<html xmlns = "http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv = "content-type" content = "text /html ؛ charset = utf-8" /> />
<title> وثيقة غير متوفرة </title>
<link href = "file: ///
<script type = "text/javaScript">
var value = document.getElementById ('Shuru') ؛
وظيفة qingkong (inpectobj) {{
if (inpectobj.value == "الرجاء إدخال اسمك") {{{
inpectobj.value = "" ؛
}
}
وظيفة likai (inpectobj) {
if (inpectobj.value == '') {
inpectobj.value = "الرجاء إدخال اسمك" ؛
}
}
</script>
<type type = "text/css">
/*يمكن للنص أدناه تغيير لون خلفية مربع الإدخال في متصفح IE*/
.
this.style.backgroundColor = "#ff0000"
} ،
onMouseout = function () {
this.style.backgroundColor = "#ffffff"
})
}
</style>
</head>
<body>
<type type = "text" id = "shuru" value = "الرجاء إدخال اسم الأغنية أو اسم المغني" onfocus = "qingkong (this)" onblur = "likai (this)"/>
</body>
</html>