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 ...
随机推荐
- Redis集群的安装和使用
- Django-rest-framework(七)swagger使用
在我们接口开发完之后,需要交付给别人对接,在没有使用swagger的时候,我们需要单独编写一份api接口文档,由postman之类的工具进行请求得到返回的结果.而有了swagger之后,可以通过提取接 ...
- #leetcode刷题之路29- 两数相除
给定两个整数,被除数 dividend 和除数 divisor.将两数相除,要求不使用乘法.除法和 mod 运算符.返回被除数 dividend 除以除数 divisor 得到的商. 示例 1:输入: ...
- SAP存储税率税码的相关表
T007A 稅關鍵字 T007B 會計中的稅務處理 T007C Groupings for tax codes T007D 賦稅群組的內文 T007F 銷項 / 進項群組的稅 T007G 不再使用該表 ...
- ABAP术语-ABAP Workbench
ABAP Workbench 原文:http://www.cnblogs.com/qiangsheng/archive/2007/12/10/989037.html Integrated graphi ...
- 快速玩转linux(2)
ssh是什么 SSH:secure shell 安全外壳协议 建立在应用层基础上的安全协议 可靠, 专为远程登录会话和其他网络服务提供安全性的协议. mark 客户端服务端都基本支持全平台 服务器 ...
- django+xadmin在线教育平台(十六)
7-7 modelform 提交我要学习咨询1 对应表userask form会对字段先做验证,然后保存到数据库中. 可以看到我们的forms和我们的model中有很多内容是一样的.我们如何让代码重复 ...
- 【路由和交换之H3C自导自演】
H3C配置自导自演 显示和维护及恢复 1:display display history-command :查看历史命令记录 display diagnostic-information :查看 ...
- Asp.Net Core 使用Docker进行容器化部署(一)
前几篇文章介绍了Liunx下的环境搭建,今天来分享一下.Net Core在Liunx上的部署. 我采用的方案是使用Dokcer作为运行虚拟机,Nginx作为Http服务器来进行反向代理,你可以理解为D ...
- 搞笑入群二维码在线生成源码 php图片合成并添加文字水印
在凤凰网看到一篇文章:微信群二维码也能“整人”,99%的好友会中招!感觉挺好玩,所以自己也想做一个! 冷静分析