效果1:

<input type="text" name="textfield" value="这里是提示内容" onclick="if(value==defaultValue){value='';this.style.color='#000'}" onBlur="if(!value){value=defaultValue;this.style.color='#999'}" />

效果2:

<input id="fast_inp" class="gettext" onblur="if(this.value==''){this.value='搜索您的信息...';}" onfocus="if(this.value=='搜索您的信息...'){this.value='';}" value="搜索您的信息..." name="q" type="text">

效果截图效果:

input 表单点击消失离开出现的更多相关文章

  1. 百度小程序-form表单点击提交,input框内容不会清空

    百度小程序与微信小程序相似度90%.微信小程序转换为百度小程序,部分还是需要人工修改! 做了一个form留言表单,点击提交之后,input框第一次会清空,但是第二次就不会清空了! 不多说直接上代码! ...

  2. React---简单实现表单点击提交插入、删除操作

    import React,{Component,Fragment} from 'react' class App extends Component { constructor(){ super() ...

  3. Javascript_06_表单验证(离开单项,输入框后提示信息)

    Javascript_06_ 表单验证(离开单项,输入框后提示信息) 说明:对于必须输入的入力框,光标离开(使用 onblur方法)时进行检查.假如有错,红色的提示信息直接在该画面的这个输入框的后面显 ...

  4. HTML5轻松实现搜索框提示文字点击消失---及placeholder颜色的设置

    在做搜索框的时候无意间发现html5的input里有个placeholder属性能轻松实现提示文字点击消失功能,之前还傻傻的在用js来实现类似功能... 示例 <form action=&quo ...

  5. input表单中嵌入百度地图

    在做项目开发中,常常会用到定位的操作,比如在做一些资产房产等方面的业务的时候,需要知道资产的具体位置,并将位置信息保存下来,这个时候我们可以使用form表单嵌入百度地图的方式来实现这个功能,下面请看详 ...

  6. input type类型和input表单属性

    一.input type类型 1.Input 类型 - email 在提交表单时,会自动验证 email 域的值. E-mail: <input type="email" n ...

  7. 兼容IE8以下浏览器input表单属性placeholder不能智能提示功能

    当前很多表单提示使用了表单属性placeholder,可这属性不兼容IE8以下的浏览器,我自己写了一个兼容处理js // 兼容IE8以下浏览器input不能智能提示功能 if(navigator.ap ...

  8. 【JavaScript学习笔记】点击消失

    <!DOCTYPE html> <html> <head> <script type="text/javascript" src=&quo ...

  9. 不让input表单的输入框保存用户输入的历史记录

    如何不让input表单的输入框保存用户输入的历史记录.  有时我们在设计网页时不想让表单保存用户输入历史记录,比如一些隐私数据,或一些冲值卡 <input name="test&quo ...

随机推荐

  1. YII安装smarty-view-renderer扩展

    smarty-view-renderer http://www.yiiframework.com/extension/smarty-view-renderer/ 相关下载及介绍:https://git ...

  2. nyoj 757 期末考试【优先队列+贪心】

    期末考试 时间限制:1000 ms  |  内存限制:65535 KB 难度:2   描述 马上就要考试了,小T有许多作业要做,而且每个老师都给出来了作业要交的期限,如果在规定的期限内没 交作业就会扣 ...

  3. Android开发之50个常见实用技巧——添加悦目的动画效果

    Hack.5 使用TextSwitcher和ImageSwitcher实现平滑过渡 实现步骤: 1.通过findViewById()方法获取TextSwitcher对象的引用Swithcer,当然也可 ...

  4. EasyUI-增删改操作

    最近公司要用easyui,这里自己看了官网几篇文章,遇到些问题,大多数的问题都是敲代码的时候笔误,其他有些地方确实需要注意一下,这里做些笔记. 1.在mysql中建好表之后修改id字段为递增字段,发现 ...

  5. webbrowser selstart selLength

    附件:http://files.cnblogs.com/xe2011/Webbrowser_SelStart.rar 1 获得webBrowser光标所在的位置 2 设置webBrowser光标的位置 ...

  6. ACM 关于数据输入加速

    转载请注明出处:http://blog.csdn.net/a1dark 分析:我们都知道运行时间对我们来说很重要.有时候不惜用大量的内存去换取一点时间.有些人可能都比较关注这个问题.首先时间上:cin ...

  7. GitHub与Versions

    [第一步]建立先仓库 第一步的话看一般的提示就知道了,在github新建一个repository(谷歌可以解决),都是可视化的界面操作,所以难度不大.或者看这里:https://help.github ...

  8. spring beans源码解读之--bean definiton解析器

    spring提供了有两种方式的bean definition解析器:PropertiesBeanDefinitionReader和XmLBeanDefinitionReader即属性文件格式的bean ...

  9. linux中的帮助命令 分类: linux 学习笔记 ubuntu 2015-07-05 19:07 31人阅读 评论(0) 收藏

    说实话,到目前为止我还是不太习惯使用linux自带的帮助文档,遇到问题都是去查我自己下载的chm格式的命令大全,不过这些帮助命令我们还是有必要了解的. 1.man [要查看的命令名称] 例如想要查看l ...

  10. js中跨域请求原理及2种常见解决方案

    一.同源策略: 说到跨域请求,首先得说说同源策略: 1995年,同源政策是由 Netscape 公司引入浏览器的.目前,所有浏览器都实行了这个政策. 同源策略是浏览器的一种安全策略,所谓同源是指,域名 ...