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 ...
随机推荐
- MVC学习五:Razor布局页面 _ViewStart.cshtml
如图: _ViewStart.cshtml就是MVC中的布局页面/模板页面. 用户访问流程图: 原理:先去执行Views文件夹下[_ViewStart.cshtml]页面,然后同级目录文件夹(上图中的 ...
- oracle 基础知识(三)
一.删除oracle 进入注册表到HKEY_LOCAL_MACHINE\SYSTEM\CurrentControlSet\Services\OracleOraHome91TNSListener Ima ...
- ES6 基础概念汇总
let const命令 声明变量 let 声明的变量 没有变量提升的效果 1 let声明的变量只在代码块内有效 for循环的计数器 2 不存在变量提升 要在声明后使用 let bar = 2 3 ...
- 手机移动端 web整合
meta基础知识 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> < ...
- 微信开发----JS-SDK接口
2018.03.15:GitHub下载代码 208.3.6:更新:我们不再使用JosnHelp返回字典类或者强类型,而是直接返回动态类型,这样就会方便的多. JsonHelp更新详情:微信开发---- ...
- c#中关于结构体和字节数组转化
最近在使用结构体与字节数组转化来实现socket间数据传输.现在开始整理一下.对于Marshal可以查阅msdn,关于字节数组与结构体转代码如下: using System; using System ...
- Openresty最佳案例 | 第3篇:Openresty的安装
转载请标明出处: http://blog.csdn.net/forezp/article/details/78616645 本文出自方志朋的博客 我的服务器为一台全新的centos 7的服务器,所以从 ...
- 轻量ORM-SqlRepoEx (二)初始化SqlRepoEx
一.SqlRepoEx引用 暂时没放至nuget上,可以直接到https://github.com/AzThinker/SqlRepoEx下载源码,编译引用. (一).静态引用 1.需引用以下dll在 ...
- [NOI2002]荒岛野人(exgcd,枚举)
题目描述 克里特岛以野人群居而著称.岛上有排列成环行的M个山洞.这些山洞顺时针编号为1,2,…,M.岛上住着N个野人,一开始依次住在山洞C1,C2,…,CN中,以后每年,第i个野人会沿顺时针向前走Pi ...
- 【PTA 天梯赛】L2-1 分而治之(结构体存边)
分而治之,各个击破是兵家常用的策略之一.在战争中,我们希望首先攻下敌方的部分城市,使其剩余的城市变成孤立无援,然后再分头各个击破.为此参谋部提供了若干打击方案.本题就请你编写程序,判断每个方案的可行性 ...