placeholder IE兼容，显示password
从网上找了很多关于placeholder IE兼容性的问题，下边的这个js方法可以显示password。
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Placeholder Polyfill Test</title>
</head>
<body> <form>
<input type="password"placeholder="password">
<input type="password"placeholder="confirm password">
</form> <script src="http://code.jquery.com/jquery-1.10.0.min.js"></script>
<script> /* placeholder polyfill plugin */ /*! http://mths.be/placeholder v2.0.7 by @mathias */
(function(f, h, $) {
var a='placeholder'in h.createElement('input'), d='placeholder'in h.createElement('textarea'), i=$.fn, c=$.valHooks, k, j; if(a&&d) {
j=i.placeholder=function() {
return this
}
;
j.input=j.textarea=true
}
else {
j=i.placeholder=function() {
var l=this; l.filter((a?'textarea':':input')+'[placeholder]').not('.placeholder').bind( {
'focus.placeholder':b, 'blur.placeholder':e
}
).data('placeholder-enabled', true).trigger('blur.placeholder');
return l
}
;
j.input=a;
j.textarea=d; k= {
get:function(m) {
var l=$(m);
return l.data('placeholder-enabled')&&l.hasClass('placeholder')?'':m.value
}
, set:function(m, n) {
var l=$(m); if(!l.data('placeholder-enabled')) {
return m.value=n
}
if(n=='') {
m.value=n; if(m!=h.activeElement) {
e.call(m)
}
}
else {
if(l.hasClass('placeholder')) {
b.call(m, true, n)||(m.value=n)
}
else {
m.value=n
}
}
return l
}
}
;
a||(c.input=k);
d||(c.textarea=k); $(function() {
$(h).delegate('form', 'submit.placeholder', function() {
var l=$('.placeholder', this).each(b); setTimeout(function() {
l.each(e)
}
, 10)
}
)
}
); $(f).bind('beforeunload.placeholder', function() {
$('.placeholder').each(function() {
this.value=''
}
)
}
)
}
function g(m) {
var l= {
}
, n=/^jQuery\d+$/; $.each(m.attributes, function(p, o) {
if(o.specified&&!n.test(o.name)) {
l[o.name]=o.value
}
}
);
return l
}
function b(m, n) {
var l=this, o=$(l); if(l.value==o.attr('placeholder')&&o.hasClass('placeholder')) {
if(o.data('placeholder-password')) {
o=o.hide().next().show().attr('id', o.removeAttr('id').data('placeholder-id')); if(m===true) {
return o[0].value=n
}
o.focus()
}
else {
l.value='';
o.removeClass('placeholder');
l==h.activeElement&&l.select()
}
}
}
function e() {
var q, l=this, p=$(l), m=p, o=this.id; if(l.value=='') {
if(l.type=='password') {
if(!p.data('placeholder-textinput')) {
try {
q=p.clone().attr( {
type: 'text'
}
)
}
catch(n) {
q=$('<input>').attr($.extend(g(this) {
type: 'text'
}
))
}
q.removeAttr('name').data( {
'placeholder-password':true, 'placeholder-id':o
}
).bind('focus.placeholder', b); p.data( {
'placeholder-textinput':q, 'placeholder-id':o
}
).before(q)
}
p=p.removeAttr('id').hide().prev().attr('id', o).show()
}
p.addClass('placeholder');
p[0].value=p.attr('placeholder')
}
else {
p.removeClass('placeholder')
}
}
}
(this, document, jQuery));
</script>
<script> $('input').placeholder();
</script>
</body>
</html>
转自这里 http://zach.lysobey.com/files/placeholder/index.html
placeholder IE兼容，显示password的更多相关文章
- placeholder不兼容 IE10 以下版本的解决方法
对于密码输入框placeholder的兼容问题:HTML代码:<input type="password" id="loginPassword" plac ...
- js解决IE8、9下placeholder的兼容问题
由于placeholder是html5的新属性,在IE8.IE9下是不能显示的,有兼容性问题. 解决思路: 1.判断目前浏览器是否支持placeholder属性 2.若不支持,则将type=" ...
- 兼容IE8 input的placeholder的文字显示
if( !('placeholder' in document.createElement('input')) ){ $('input[placeholder],textarea[placeholde ...
- placeholder的兼容处理(jQuery下)
这是一个老问题,结合前辈们的经验,需要处理的问题有一下几个. 1.只有输入框(input/textarea)下的palaceholder属性存在的时候才需要处理这类兼容 2.处理好输入框上焦点和是焦点 ...
- HTML5表单提示placeholder属性兼容IE
placeholder 属性提供可描述输入字段预期值的提示信息(hint). 该提示会在输入字段为空时显示,并会在字段获得焦点时消失. 注释:placeholder 属性适用于以下的 <inpu ...
- placeholder属性兼容ie8
<!doctype html> <html> <head> <meta charset="utf-8" /> <title&g ...
- html5 placeholder属性兼容ie11
placeholder 属性是html5的属性,用于提供描述输入字段预期值的提示信息(hint). 简单例子: <!DOCTYPE HTML> <html> <body& ...
- 解决IE中placeholder的兼容问题
定义和用法 placeholder 属性提供可描述输入字段预期值的提示信息(hint). 该提示会在输入字段为空时显示,并会在字段获得焦点时消失. 注释:placeholder 属性适用于以下的 &l ...
- IE9 placeholder 不兼容的解决
坑爹的IE9-,真的是够够的了,不过公司不要求兼容这个玩意了,自己觉得兼容这个鬼还是挺有挑战性的,自己也碰到不少难题,一个个解决. css: .placeholderColor { color : # ...
随机推荐
- 非旋Treap及其可持久化
平衡树这种东西,我只会splay.splay比较好理解,并且好打,操作方便. 我以前学过SBT,但并不是很理解,所以就忘了怎么打了. 许多用平衡树的问题其实可以用线段树来解决,我们真正打平衡树的时候一 ...
- Eclipse Java开发环境的搭建
(2019年2月19日注:这篇文章原先发在自己github那边的博客,时间是2016年9月6日) 工作室的老人家们和小朋友们组成了一个Java开发学习团队,想起之前在暑假项目中学过一点Java基础知识 ...
- Sping中的AOP
AOP(Aspect Oriented Programming)面向切面编程,什么是切面.形象的说,我们编写的代码都是一种有序的流程,比如产品管理,订单管理,而切面就是垂直于这些流程的. 比如日志服务 ...
- PAT甲级——A1006 Sign In and Sign Out
At the beginning of every day, the first person who signs in the computer room will unlock the door, ...
- Django项目: 项目环境搭建 ---- 二、django项目设置
1.配置模板文件 TEMPLATES = [ { 'BACKEND': 'django.template.backends.django.DjangoTemplates', 'DIRS': [os.p ...
- HDU--2191 汶川地震购米（多重背包）
题目:http://acm.hdu.edu.cn/showproblem.php?pid=2191 分析:有资金n元,而市场有m种大米,每种大米价格不等,重量不等,数量不等, 并且只能整袋购买.如何用 ...
- docker上构建redis容器
1.查看docker上的镜像 [root@holly ~]# docker images 2.搜索docker上的redis镜像,选择下载的版本 [root@holly ~]# docker sear ...
- hive设置列头（永久模式）
到hive目录下的hive-site <property> <name>hive.cli.print.header</name> <value>true ...
- 【深度学习】CNN 中 1x1 卷积核的作用
[深度学习]CNN 中 1x1 卷积核的作用 最近研究 GoogLeNet 和 VGG 神经网络结构的时候,都看见了它们在某些层有采取 1x1 作为卷积核,起初的时候,对这个做法很是迷惑,这是因为之前 ...
- Nopi 导出设置行高
1.导出excel行显示不完整数据客户不满意,需要我们处理 ; rowNum <= sheet.LastRowNum; rowNum++) { HSSFRow currentRow = shee ...