i8浏览器不支持placeholder属性解决办法,以及解决后,文字不居中问题
这里想实现的效果是:设置和移除文本框默认值,如下图鼠标放到文本框中的时候,灰字消失。

1.可以用简单的方式,就是给input文本框加上onfocus属性,如下代码:
- <input id="keyword" name="keyword" size="10" class="inputstyle keywords" value="请输入企业名称、统一社会信用代码或注册号"
- onfocus='if(this.value=="请输入企业名称、统一社会信用代码或注册号"){this.value="";}; '
- onblur='if(this.value==""){this.value="请输入企业名称、统一社会信用代码或注册号";};'>
其实onfocus属性挺好用的,还可以在通过onfocus属性改变css样式,如下代码:
- <input id="keyword" name="keyword" size="10" class="inputstyle keywords" value="请输入关键字进行搜索"
- onfocus='if(this.value=="请输入关键字进行搜索"){this.value="";}; this.className="input01"'
- onblur='if(this.value==""){this.value="请输入关键字进行搜索";}; this.className="input02"'>
在这个问题解决了以后,可能会出现文字不居中的问题,这时候只需要使用一个属性就可以,例如 line-height: 40px
2.也可以使用jquery实现:
- $(document).ready(function() {
- var vdefault = $('#keyword').val();
- $('#keyword').focus(function() {
- //获得焦点时,如果值为默认值,则设置为空
- if ($(this).val() == vdefault) {
- $(this).val("");
- }
- });
- $('#keyword').blur(function() {
- //失去焦点时,如果值为空,则设置为默认值
- if ($(this).val()== "") {
- $(this).val(vdefault); ;
- }
- });
i8浏览器不支持placeholder属性解决办法,以及解决后,文字不居中问题的更多相关文章
- 当浏览器不支持placeholder,所执行的函数
$(function(){ //判断浏览器是否支持placeholder属性 supportPlaceholder='placeholder'in document.createElement('in ...
- 在IE8等不支持placeholder属性的浏览器中模拟placeholder效果
placeholder是一个很有用的属性,可以提示用户在input框中输入正确的内容,但是IE8以及IE8一下的浏览器不支持该属性,我们可以使用js来模拟相似的效果.下面直接上代码: <!doc ...
- input date 支持placeholder属性
第一种解决方法:IE,火狐浏览器,不支持input date的日历功能,火狐支持日历功能 ie,火狐,谷歌显示placeholder属性 css代码 #dateofday:before{ col ...
- 让ie8支持 placeholder 属性
一. ie8支持 placeholder 属性 /* * ie8支持 placeholder 属性 */ $(function(){ if( !('placeholder' in document. ...
- 关于使用jquery时,ie8下提示对象不支持的属性或方法的解决办法
转自:http://wapapp.baidu.com/auoong/item/538790fcbe87c834d7ff8cde 首先这个问题的前提是已经排除了常见的这个问题.下面说一种今天我碰到的一种 ...
- 对象不支持“attachEvent”属性或方法的解决办法
有些脚本在IE11下执行会报错误: 对象不支持“attachEvent”属性或方法 解决办法 解决办法:把attachEvent改为addEventListener即可
- ecshop transport.js IE报错(608行),对象不支持此属性或方法 的解决办法
解决办法: 将if (this.hasOwnProperty(k)) { 改为: if (this.hasOwnProperty && this.hasOwnProperty(k)) ...
- 基于jquery 的插件,让IE支持placeholder属性
开发一个项目的时候为了美观和用户体验用到了input标签的placeholder属性,但是这个属性是html5中的,所以低版本的IE浏览器不支持.于是在百度找了一些解决方法,找了好几个都不是那么完美, ...
- 有关ie9 以下不支持placeholder属性以及获得焦点placeholder的移除
(一)placeholder 属性起到提示客户输入信息作用 (二)ie9以下出问题了 placeholder不支持 (三)解决办法 先贴html 加上jquery代码就可以了 关于表单获取焦点,chr ...
随机推荐
- 2018年暑假ACM个人训练题9(动态规划)解题报告
A:m段最大字段和问题 https://www.cnblogs.com/yinbiao/p/9314528.html B:map的使用(根本就不是dp!!!) https://www.cnblogs. ...
- 火狐 SSL 收到了一个弱临时 Diffie-Hellman 密钥
火狐 SSL 收到了一个弱临时 Diffie-Hellman 密钥 最近在用FireFox 调试时使用Https,连接 https网址 时发生错误. 在服务器密钥交换握手信息中 SSL 收到了一个 ...
- Openresty最佳案例 | 第8篇:RBAC介绍、sql和redis模块工具类
转载请标明出处: http://blog.csdn.net/forezp/article/details/78616738 本文出自方志朋的博客 RBAC介绍 RBAC(Role-Based Acce ...
- Python常用模块之re
1.正则表达式规则 2.Python正则常用模块 2.1.re.match与re.search 函数说明:re.match 尝试从字符串的起始位置匹配一个模式,如果不是起始位置匹配成功的话,match ...
- Aaliyun Linux 64 安装jdk+mysql+tomcat
参考: http://www.blogjava.net/amigoxie/archive/2013/02/22/395605.html http://bbs.aliyun.com/read/17704 ...
- 【2017 World Final E】Need For Speed(二分)
Sheila is a student and she drives a typical student car: it is old, slow, rusty, and falling apart. ...
- BZOJ1030: [JSOI2007]文本生成器(AC自动机)
Time Limit: 1 Sec Memory Limit: 162 MBSubmit: 5984 Solved: 2523[Submit][Status][Discuss] Descripti ...
- DbUtils: JDBC Utility Component Examples翻译
DbUtils:JDBC实用组件实例 这一页提供了一些展示如何使用DbUtils的示例. 基本用法 DbUtils是一个非常小的类库,因此浏览完所有类的javadoc不会花费很长时间.DbUtils的 ...
- Vue报错 [Vue warn]: Cannot find element
在前端开发全面进入前端的时代 作为一个合格的前端开发工作者 框架是不可或缺的Vue React Anguar 作为前端小白,追随大佬的脚步来到来到博客园,更新现在正在学习的Vue 注 : 相信学习Vu ...
- thinkphp3.2.3实现多条件查询实例.
$data = M("datainfo"); $projectsname = I('get.projectsname');//前台提交的模糊查询字段 // 查询条件 $where ...