实用的placeholder插件,兼容IE下的placeholder,jquery插件

placeholder在IE下无法兼容 ,下面的插件很好的处理了这个问题,拿去不谢

 1 /*
 2  * jQuery placeholder, fix for IE6,7,8,9
 3  * @website itmyhome.com
 4  */
 5 var JPlaceHolder = {
 6     //检测
 7     _check : function(){
 8         return ‘placeholder‘ in document.createElement(‘input‘);
 9     },
10     //初始化
11     init : function(){
12         if(!this._check()){
13             this.fix();
14         }
15     },
16     //修复
17     fix : function(){
18         jQuery(‘:input[placeholder]‘).each(function(index, element) {
19
20             var self = $(this), txt = self.attr(‘placeholder‘);
21             self.wrap($(‘<div></div>‘).css({position:‘relative‘, zoom:‘1‘, border:‘none‘, background:‘none‘, padding:‘none‘, margin:‘none‘}));
22             var pos = self.position(), h = self.outerHeight(true), paddingleft = self.css(‘padding-left‘);
23
24             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());
25             self.focusin(function(e) {
26                 holder.hide();
27             }).focusout(function(e) {
28                 if(!self.val()){
29                     holder.show();
30                 }
31             });
32             holder.click(function(e) {
33                 holder.hide();
34                 self.focus();
35             });
36         });
37     }
38 };
39
40 //执行
41 jQuery(function(){
42     JPlaceHolder.init();
43 });

原文地址:https://www.cnblogs.com/wm218/p/9617243.html

时间: 2024-10-13 16:07:09

实用的placeholder插件,兼容IE下的placeholder,jquery插件的相关文章

简单实用的鼠标滑过图片遮罩层动画jQuery插件

nsHover是一款简单实用的鼠标滑过图片遮罩层动画jQuery插件.该插件可以在图片或块级元素上制作鼠标滑过时的遮罩层动画效果,它可以设置遮罩层的前景色和背景色,可以制作圆形图片等,非常实用. 在线预览   源码下载 使用方法 使用该鼠标滑过插件需要引入jQuery和ns.hover.min.js文件. 1 2 <script src="js/jquery.min.js"></script> <script src="js/ns.hover.m

AMD异步模块定义介绍和Require.js中使用jQuery及jQuery插件的方法

AMD 模块 AMD(异步模块定义,Asynchronous Module Definition)格式总体的目标是为现在的开发者提供一个可用的模块化 JavaScript 的解决方案. AMD 模块格式本身是一个关于如何定义模块的提案,在这种定义下模块和依赖项都能够异步地进行加载.它有很多独特的优势,包括天生的异步及高度灵活等特性,这些特性能够解除常见的代码与模块标识间的那种紧密耦合.目前它已经被很多项目所接纳,包括jQuery(1.7). RequireJS RequireJS是一个工具库,主

jQuery 插件编程精讲与技巧

适应的读者: 1.有一定的jquery编程基础但是想在技能上有所提升的人 2.前端开发的程序员 3.对编程感兴趣的学生 为什么要学习jquery插件的编写? 为什么要学习jquery插件的编写?相信这是很多人都会有的问题,因为目前市面上的插件众多基本上满足日常的开发需求,但是我认为一下的这几点情况是一定要学会插件基础才能解决的: 1.如果有这样的一种场景:假设如果你使用了一个控件,但是这个控件有缺少了一点点的相关的功能,那么如果你不懂jquery插件编写的话,那么你就只能找其他的控件进行补充,这

写jQuery插件

手把手教你怎么写jQuery插件 这次随笔,向大家介绍如何编写jQuery插件.啰嗦一下,很希望各位IT界的‘攻城狮’们能和大家一起分享,一起成长.点击左边我头像下边的“加入qq群”,一起分享,一起交流,当然,可以一起吹水.哈,不废话,进入正题. jQuey是一个非常好用的javascript类库,提供了非常多的接口给程序员使用.但在某些具体方面,并没有完全提供解决方法,这就要求我们自己实现.jQuery官方也提供jQuery拓展的标准.编写jQuery插件时,应该注意一下几点原则: 1. 避免

怎么写jQuery插件

jQuey是一个非常好用的javascript类库,提供了非常多的接口给程序员使用.但在某些具体方面,并没有完全提供解决方法,这就要求我们自己实现.jQuery官方也提供jQuery拓展的标准.编写jQuery插件时,应该注意一下几点原则: 1. 避免全局依赖. 2. 避免第三方破坏. 3. 兼容jQuery操作符'$'和'jQuery' 这三个原则非常重要,否则,这个插件将会失去插件的意义. jquery插件命名,一般在前面加上jquery,这样别人就知道这是jQuery插件.如:jquery

推荐60个jQuery插件(转)

jQuery插件jQuery Spin Button自定义文本框数值自增或自减 jQuery插件JQuery Pager分页器实现javascript分页功能 jQuery插件FontSizer实现Javascript自定义动态调整网页文字大小 jQuery插件Magnify放大镜实现javascript图片放大功能 jQuery插件tooltip提示条实现Javascript动态文字或图片提示效果 jQuery插件Step Carousel Viewer实现Javascript图片滑动旋转效果

手把手教你怎么写jQuery插件

[原创作品]手把手教你怎么写jQuery插件 这次随笔,向大家介绍如何编写jQuery插件.啰嗦一下,很希望各位IT界的'攻城狮'们能和大家一起分享,一起成长.点击左边我头像下边的"加入qq群",一起分享,一起交流,当然,可以一起吹水.哈,不废话,进入正题. jQuey是一个非常好用的javascript类库,提供了非常多的接口给程序员使用.但在某些具体方面,并没有完全提供解决方法,这就要求我们自己实现.jQuery官方也提供jQuery拓展的标准.编写jQuery插件时,应该注意一下

jquery学习(四)-如何书写自定义的jquery插件

来自锋利的jquery第二版 下面我们开始介绍如何通过现有的方法和函数,封装出既符合自己需求,有高效的插件. Jquery插件公分为3类,分别为:封装对象方法的插件.封装全局函数的插件.自定义选择器插件,在介绍插件的三种类型之前,我们先来了解书写插件的基本要点(这里转自aspwzmuma和锋利的jquery): a.插件的文件命名推荐遵循jQuery.[插件名].js的规则,以便于与其他的js文件的区分,如新插件文件jquery.newplugin.js. b.对象级别插件,所有的方法都应依附于

经典海量jQuery插件

海量的jQuery插件帖,很经典,不知道什么时候开始流传,很早以前就收藏过,为了工作方便还是发了一份放在日志里面. 其中有些已经无法访问,或许是文件移除,或许是被封锁.大家分享的东西,没什么特别的可说的,唯有感谢无私分享的人们. 猫嗔提醒大家在使用的时候注意jQuery包的版本问题,最好是使用相同的版本,因为使用了高版本很有可能出现或多或少的问题.并且其中英文插件在转换成中文时注意编码,推荐utf-8. jQuery插件-文件上传(File upload)Ajax File Upload.jQU