<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> .g{ color: lightgray; } .b{ color: #000; } </style> </head> <body> <input type="text" placeholder="请输入内容"/> <!--不是每个浏览器都支持这个--> <p>当鼠标进入时，移除内容 /n 当鼠标退出时，添加内容</p> <input type="text" class="g" value="请输入内容" onfocus="Focus(this);" onblur="Blur(this)" /> <script> function Focus(arg){ arg.className="b" var current_val= arg.value; console.log(current_val) if(current_val=='请输入内容'){ arg.value=""; } } function Blur(arg) { var current_val= arg.value; if(current_val=='请输入内容'||current_val.trim().length==0){ arg.value='请输入内容' arg.className='g' } } </script> </body> </html>