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 ...
随机推荐
- P2852 [USACO06DEC]牛奶模式Milk Patterns
link 这是一道后缀匹配的模板题 我们只需要将height算出来 然后二分一下答案就可以了 #include<cstdio> #include<algorithm> #inc ...
- python之yield表达式
yield表达式用于generator function 调用generator function时,返回一个iterator(函数内语句不被会执行),调用iterator函数时,执行到yield表达 ...
- eclipse的中文插件链接及使用方法
链接:http://www.eclipse.org/babel/downloads.php 帮助-->安装-->打开链接使用链接里面的语言包下载地址-->下载安装-->完成
- flex 遇到white-space:nowrap
背景,做一个前面图片宽度固定,后面宽度自适应,使用到了flex布局,但是想让后面div里文字不换行,超出以点点表示时,这时布局就乱了,查了下,原来flex布局与white-space:nowrap有影 ...
- #leetcode刷题之路11-盛最多水的容器
给定 n 个非负整数 a1,a2,...,an,每个数代表坐标中的一个点 (i, ai) .在坐标内画 n 条垂直线,垂直线 i 的两个端点分别为 (i, ai) 和 (i, 0).找出其中的两条线, ...
- 关于mysql8.0.11版本在win10安装
新的mysql版本没有.exe文件一键安装,网上找了教程,自己搞了下 首先是在菜鸟教程 http://www.runoob.com/mysql/mysql-install.html 根据它的提示下载w ...
- 【Linux磁盘优化管理--RAID和LVM】
在现阶段的企业环境中,为了数据的安全性及完整性必须要有一个合理的存储方案.面对着每秒可能产生超过几TB的数据,考虑到磁盘能不能实现 热冗余,及扩容,缩容.Linux给出了RAID(磁盘阵列)以及LVM ...
- 响应式布局--设置rem自适应
//designWidth:设计稿的实际宽度值,需要根据实际设置 //maxWidth:制作稿的最大宽度值,需要根据实际设置 //这段js的最后面有两个参数记得要设置,一个为设计稿实际宽度,一个为制作 ...
- Cython中def,cdef,cpdef的区别
这是我的第一篇翻译,希望大家多多给出意见和建议. 如有转载,请注明出处. 原文来自:https://stackoverflow.com/questions/28362009/definition-of ...
- 11 非阻塞套接字与IO多路复用(进阶)
1.非阻塞套接字 第一部分 基本IO模型 1.普通套接字实现的服务端的缺陷 一次只能服务一个客户端! 2.普通套接字实现的服务端的瓶颈!!! accept阻塞! 在没有新的套接字来之前,不能处理已经建 ...