在《JavaScript dom 编程艺术》第11章学来的。
相对于用JavaScript替换文本框的提示语句
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <title>Document</title>
6 <script>
7 window.onload = function() {
8 //需要判断浏览器是否支持placeholder属性，检测到不支持时才会调用这代码。
9 if(!(‘placeholder‘ in document.createElement(‘input‘))){
10 //获取文本框对象
11 var input = document.getElementById(‘z‘);
12 //获取占位符文本
13 var inputValue = input.placeholder;
14 input.onfocus = function(){
15 if(this.value == inputValue){
16 //重置输入框的值，以隐藏临时的占位符文本
17 input.value = "";
18 }
19 }
20 input.onblur = function(){
21 if(this.value == ""){
22 input.value = inputValue;
23 }
24 }
25 //在onblur处理函数运行中添加占位符文本
26 input.onblur();
27 }
28 }
29 </script>
30 </head>
31 <body>
32 <form action="">
33 <input type="text" placeholder="请输入...." id = "z">
34 </form>
35 </body>
36 </html>
时间： 2024-10-12 17:50:47