完美让IE兼容input placeholder属性的jquery实现
调用时直接引用jquery与下面的js就行了,相对网上的大多数例子来说,这个是比较完美的方案。
/* * 球到西山沟 * http://www.cnzj5u.com * 2014/11/26 12:12 */ (function ($) { //判断是否支持placeholder function isPlaceholer() { var input = document.createElement("input"); return "placeholder" in input; } var placeholderfriend = { focus: function (s) { s = $(s).hide().prev().show().focus(); } } //不支持的代码 if (!isPlaceholer()) { $(function () { var form = $(this); var elements = form.find("input[placeholder]"); elements.each(function (i) { var s = $(this); var pValue = s.attr("placeholder"); var sValue = s.val(); if (pValue) { if (sValue == "") { //DOM不支持type的修改,需要复制密码框属性,生成新的DOM var html = this.outerHTML || ""; html = html .replace(/\s*type=(['"])?password\1/gi, " type=\"text\" ") .replace(/\s*value=(['"])?\S*\1?/gi, " value=\"" + pValue + "\" onfocus=\"phfrfocus(this);\" style=\"color:#a9a9a9;\" "); s.hide(); s.after(html); } } }); elements.blur(function () { var s = $(this); var sValue = s.val(); if (sValue == "") { s.hide().next().show(); } }); }); } window.phfrfocus = placeholderfriend.focus; })(jQuery);
完美让IE兼容input placeholder属性的jquery实现的更多相关文章
- 改进《完美让IE兼容input placeholder属性的jquery实现》的不完美
<完美让IE兼容input placeholder属性的jquery实现>中的代码在IE9以下浏览器中会出错,原因是因为ie9以下的浏览器对input的标签的解释不同. 例如对以下文本框的 ...
- HTML 5 <input> placeholder 属性
原文链接:http://www.w3school.com.cn/html5/att_input_placeholder.asp HTML 5 <input> placeholder 属性 ...
- 兼容的placeholder属性
作为一个.net后台开发的程序猿,博客里既然大多都是前端相关的博文.是不是该考虑换方向了,转前端开发得了 ... 小小吐槽一下,近期受该不该跳槽所困惑,我有选择困难症! 继续前端,这次说一下输入框 p ...
- input placeholder属性 样式修改(颜色,大小,位置)
placeholder属性 样式修改 <!DOCTYPE html> <html> <head> <meta charset="utf-8" ...
- HTML 5 <input> placeholder 属性 实现搜索框提示文字点击输入后消失
H5之前要实现这个功能还要用到JS,H5出来之后新增加了placeholder属性,有了这个属性就就能轻松实现这个功能. 定义和用法 placeholder 属性提供可描述输入字段预期值的提示信息(h ...
- Html5 input placeholder 属性字体颜色修改。
这篇文章主要介绍了有关HTML5 input placeholder 颜色修改方面的知识,需要的朋友可以参考下 Chrome支持input=[type=text]占位文本属性,但下列CSS样式 ...
- HTML <input> placeholder 属性
css ::-webkit-input-placeholder { /* WebKit, Blink, Edge */ color: #909; } :-moz-placeholder { /* Mo ...
- input placeholder属性IE、360浏览器兼容性问题
效果:http://hovertree.com/texiao/jquery/43/ 效果二:http://hovertree.com/texiao/jquery/43/1/ 请在IE中体验. 1.创建 ...
- html5 <input> placeholder 属性
带有 placeholder 文本的搜索字段: <form action="demo_form.asp" method="get"> <inp ...
随机推荐
- 【转】linux 中dd命令使用详解
原文网址:http://xiaozhuang.blog.51cto.com/4396589/850657 原创作品,允许转载,转载时请务必以超链接形式标明文章 原始出处 .作者信息和本声明.否则将追究 ...
- HDU-4272 LianLianKan
http://acm.hdu.edu.cn/showproblem.php?pid=4272 据说是状态压缩,+dfs什么什么的,可我这样也过了,什么算法都是浮云 ,暴力才是王道.我也归类为状态压缩, ...
- 手把手教你学习DSP_硬件设计
<<手把手教你学习DSP>>顾卫刚,感觉写的不错,将感兴趣的部分摘录下俩. 1.A/D保护及矫正电路 TMS320X2812 AD输入为0-3V,用上述电路可以起到钳位作用.当 ...
- HDOJ(HDU) 2523 SORT AGAIN(推导排序、、)
Problem Description 给你N个整数,x1,x2-xn,任取两个整数组合得到|xi-xj|,(0 < i,j<=N,i!=j). 现在请你计算第K大的组合数是哪个(一个组合 ...
- Torque2D MIT 学习笔记(27) ---- ImageFont的使用以及字体ImageAsset的工具生成
前言 ImageFont继承于SceneObject,是一个场景对象,支持例如旋转,缩放,移动加速度以及物理碰撞等一切Torque中场景对象的一切功能. ImageFont只支持ASCII编码表中的3 ...
- Matlab编程-数值计算相关语法
1.变量的命名规则(类似C语言): (1) 区分大小写 (2) 变量长度不超过31位 (3) 变量名以字母开头,变量名中包含字母.数字.下划线,不可以用标点 2. Mathlab预定 ...
- UVa1572 UVaLive6393 Self-Assembly
填坑系列(p.172) 注意“可以旋转和翻转” 然后将每个字母看成点 不然边数就是n^2级的 #include<cstdio> #include<cstring> #inclu ...
- 搜狗输入法皮肤安装 分类: windows常用小技巧 2014-05-04 15:10 172人阅读 评论(0) 收藏
第一步: 下载皮肤,皮肤是.ssf格式的. 第二步: 找到安装目录:(以我的为例) D:\软件\搜狗输入法\SogouInput\7.1.0.1652\AllSkin: 把下载的皮肤剪切(或复制)到此 ...
- android 03 TableLayout
MainActivity.java(默认的,什么都没有) package com.sxt.day02_02; import android.os.Bundle; import android.app. ...
- QTableWidget的使用和美工总结
基本外观设置 FriendTable->setFrameShape(QFrame::NoFrame); //设置边框 FriendTable->setHorizontalHeaderLa ...