//placeholder兼容方法(兼容IE8以上浏览器)
var JPlaceHolder = {
//检测
_check: function () {
return 'placeholder' in document.createElement('input');
},
//初始化
init: function () {
if (!this._check()) {
this.fix();
}
},
//修复
fix: function () {
jQuery(':input[placeholder]').each(function (index, element) {
var self = $(this), txt = self.attr('placeholder');
self.wrap($('<div></div>').css({
position: 'relative',
zoom: '1',
border: 'none',
background: 'none',
padding: 'none',
margin: 'none'
}));
var pos = self.position(), h = self.outerHeight(true), paddingleft = self.css('padding-left');
//此处的css样式,根据情况修改
var holder = $('<span></span>').text(txt).css({
position: 'absolute',
left: pos.left,
// top: pos.top,
height: h + 'px',
lineHeight: h + 'px',
paddingLeft: paddingleft,
color: '#aaa',
paddingTop: '15px',
textAlign: 'center',
width: '347px'
}).appendTo(self.parent());
self.focusin(function (e) {
holder.hide();
}).focusout(function (e) {
if (!self.val()) {
holder.show();
}
});
holder.click(function (e) {
holder.hide();
self.focus();
});
});
}
};
//执行placeholder兼容方法
jQuery(function () {
JPlaceHolder.init();
});

placeholder兼容方法(兼容IE8以上浏览器)的更多相关文章

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

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

  2. IE8及以下浏览器伪数组slice方法兼容处理

    前几天同事说数组的slice方法在IE8下有兼容问题,我查阅了MDN,文档里面有提到IE8及以下浏览器中,DOM对象组成的伪数组通过call调用slice方法没有遵循标准行为 我做了个demo在IE8 ...

  3. JS--事件对象中部份浏览器不兼容方法

    测试时主要用的浏览器是Firefox 28.0.IE11.IE8.Chrome 34.0  一.什么是事件对象:当触发某个事件的时候,会产生一个事件对象,这个对象包含着所有的与事件有关的信息,包括导致 ...

  4. Javascript不同浏览器差异及兼容方法

    原文链接:http://caibaojian.com/js-ie-different-from-firefox.html javascript的各种兼容就是为了解决不同浏览器的差异性,了解其中的差异能 ...

  5. CSS中设置DIV垂直居中的N种方法 兼容IE浏览器

    在说到这个问题的时候,也许有人会问CSS中不是有vertical-align属性来设置垂直居中的吗?即使是某些浏览器不支持我只需做少许的CSS Hack技术就可以啊!所以在这里我还要啰嗦两句,CSS中 ...

  6. 使用FlashWavRecorder实现浏览器录制wav音频和上传音频文件,兼容IE8以上浏览器

    前言:本项目基于github开源插件实现,该插件使用flash实现,兼容IE8以上浏览器 感谢michalstocki的分享该项目,github项目地址:https://github.com/mich ...

  7. google浏览器window.onbeforeunload方法兼容问题

    window.onbeforeunload方法在IE内核浏览器是有效的,但是在google浏览器中并不兼容,请教给位怎么在google浏览器中兼容window.onbeforeunload方法 采纳的 ...

  8. 阻止a标签跳转四种方法 兼容各大浏览器(包括IE)

    阻止a标签跳转四种方法 兼容各大浏览器(包括IE) HTML <!--第一种--> <a href="javascript:;">我不会被跳转</a& ...

  9. 下拉菜单select高度(兼容IE6/IE7/IE8/火狐等主流浏览器)

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

随机推荐

  1. C# 线程问题

    一:概述和概念 C#支持通过多线程并行地执行代码,一个线程有它独立的执行路径,能够与其它的线程同时地运行.一个C#程序开始于一个单线程,这个单线程是被CLR和操作系统(也称为"主线程&quo ...

  2. JavaScript经典语录

    Js的解析与执行过程: 全局中的解析和执行过程:一:预处理:创建一个此法环境LE, 扫描JS:1.用声明的方式声明的函数(不是函数表达式),2.用var定义的变量.加到预处理阶段的此法环境中 全局环境 ...

  3. C语言基础:进制转换,变量,常量,表达式,基本数据类型,输出函数,输入函数,运算符. 分类: iOS学习 c语言基础 2015-06-10 21:39 25人阅读 评论(0) 收藏

    二进制:以0b开头,只有0和1两种数字.如0101 十进制:0~9十个数字表示.如25 十六进制:以0~9,A~F表示,以0X开头.如0X2B 十进制转换为X进制:连除倒取余 X进制转换为十进制:按权 ...

  4. Postfix之sasldb2

    # 2.#配置postfix启用sasldb2作为smtp的账号秘密效验方式 3.#编辑通过sasl启用smtp账号密码效验的配置 4.vi /etc/sasl2/smtpd.conf #vi写入或编 ...

  5. 圆角button

    方案1: <Window.Resources> <ControlTemplate x:Key="CornerButton" TargetType="{x ...

  6. Smart210学习记录------paltform总线

    转自http://blog.csdn.net/xiaochongtou123/article/details/7752328 1.概述: 通常在Linux中,把SoC系统中集成的独立外设单元(如:I2 ...

  7. I.MX6 32G SD卡测试

    /*********************************************************************** * I.MX6 32G SD卡测试 * 说明: * 这 ...

  8. curl 发送带有Authorization的post请求命令

    curl --user user:password  -d "param1=111&param2=222" "http://127.0.0.1/cmd"

  9. Java Super 覆盖方法

    子类从父类中继承方法,有时候,子类需要修改父类中定义的方法的实现,这称作方法覆盖. 比如,GeometricObject类中的toString方法返回表示集合对象的字符串,这个方法就可以被覆盖,返回表 ...

  10. 能不能对metronic继续封装一下呢

    按照这篇文章的说法,目前metronic的层级还是较低的,只是针对Bootstrap做了很多的用例(最佳实践). 我上一个项目是用easy UI,准确地说,是经过简单封装的easy UI.用起来非常爽 ...