例题:当鼠标移动到某个文本框时,提示语消失。 当失去焦点时,如果该文本框有内容,保存内容。没有内容,则恢复最初的提示语句
<!DOCTYPE html> <html> <head> <script type="text/javascript" src="jquery-3.3.1.js"></script> <meta charset="UTF-8"> </head> <body> <input type="text" id="login" value="test_cmf" /> <br/> <input type="password" /> <script type="text/javascript"> //focus事件 //1.当login文本框有焦点的时候,文本框的值为空 //2.否则取当前值 $(document).ready(function(){ $("#login").focus(function(){ $current=$(this).val(); if ($current==this.defaultValue) { $("#login").val(""); }else{ $("#login").val($current); } }); }); //blur事件 //1.当login文本框的内容为空时,给他设置当前值 //2.否则取当前值 $(document).ready(function(){ $("#login").blur(function(){ $current=$(this).val(); if ($current=="") { $("#login").val(this.defaultValue); }else{ $("#login").val($current); } }); }); </script> </body> </html>
界面: