输入框提示文字,点击清除离开恢复效果

发布时间：2018-10-05 11:08:03 所属栏目：PHP教程来源：站长网

导读：今天要介绍的网页特效是利用js功能给输入框(input)增加文字提示效果，当我们用鼠标点击输入框时，文字消失，鼠标离开后，文字恢复。同时，还增强到提交表单的使用，如果输入为空或者默认不输入的情况下，直接点击提交，就会弹出提示。当然这些东西都是可

　　今天要介绍的网页特效是利用js功能给输入框(input)增加文字提示效果，当我们用鼠标点击输入框时，文字消失，鼠标离开后，文字恢复。

　　同时，还增强到提交表单的使用，如果输入为空或者默认不输入的情况下，直接点击提交，就会弹出提示。

　　当然这些东西都是可以自定义的，先看一下效果再说吧。

　　网页版：猛击这里

　　运行版：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head lang="zh-cn"> <meta http-equiv="content-type" content="text/html; charset=gb2312" /> <meta http-equiv="Content-Language" content="zh-cn" /> </head> <body> <title>输入框提示文字，点击清除离开恢复，输入为空时点击提交弹出警告 - Liehuo.Net</title> <FORM method="post" action="http://www.veryhuo.com/" target="_blank" onsubmit="if(this.k.value==''||this.k.value=='请输入要搜索的关键词,如:烈火'){alert('请输入搜索词');return false;}"> <INPUT style="width:200px;" onBlur="if (value ==''){value='请输入要搜索的关键词,如:烈火'}" id="k" class="ipt1" onFocus="if (value =='请输入要搜索的关键词,如:烈火'){value =''}" value="请输入要搜索的关键词,如:烈火" name="q"> <INPUT value="搜索" type="submit" name="sou"> </FORM> </body> </html> <br /><center>如不能显示效果，请按Ctrl+F5刷新本页，更多网页代码：<a href='http://www.veryhuo.com/' target='_blank'>http://www.veryhuo.com/</a></center>
提示：可修改后代码再运行!

（编辑：济南站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!

揭晓学好java开发的关	用php怎样实现数字转化
PHP导出数据超时怎么办	浅谈Laravel参数验证的