在IE下实现placeholder效果
相信不少网友都会在IE 浏览器中,使用表单placeholder这个属性时,会不生效,下面是用jquery就行了,样式有偏差的需要自己修改点样式就行了
/*
* jQuery placeholder, fix for IE6,7,8,9
* @author JENA
* @since 20131115.1504
* @website ishere.cn
*/
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'
);
var
holder = $(
'<span></span>'
).text(txt).css({position:
'absolute'
, left:pos.left, top:pos.top, height:h, lienHeight:h, paddingLeft:paddingleft, color:
'#aaa'
}).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();
});
});
}
};
//执行
jQuery(
function
(){
JPlaceHolder.init();
});
Dcr163的博客
https://www.dcr163.cn/82.html(转载时请注明本文出处及文章链接)