解决HTML5中placeholder属性兼容性的JQuery插件

//调用方法

$(function () {
   $(".pHolder").jason();

});

//HTML代码

<input type="text" class="pHolder" placeholder="请输入姓名" />

//jquery插件

($.fn.jason = function(a) {
    var b = {
        focus: "black",
        unfocus: "#999"
    }, c = $.extend(b, a);
    return $(this).each(function() {
        if (!$.support.leadingWhitespace||($.browser.msie && $.browser.version < 10)) {//判断ie,如果jQuery版本过高就不能使用后面的判断
            var a = $(this).attr("placeholder");
            $(this).val(a), $(this).css("color", c.unfocus), $(this).focus(function() {
                ($(this).val() == a || "" == $(this).val()) && ($(this).attr("placeholder", ""),
                $(this).val(""), $(this).css("color", c.focus));
            }), $(this).blur(function() {
                ($(this).val() == a || "" == $(this).val()) && ($(this).val(a), $(this).css("color", c.unfocus));
            });
        }
    });
})(jQuery);

解决HTML5中placeholder属性兼容性的JQuery插件,布布扣,bubuko.com

时间: 2024-12-21 23:49:52

解决HTML5中placeholder属性兼容性的JQuery插件的相关文章

ie兼容html5中placeholder属性

<!doctype html><html><head><meta charset="utf-8"><title>placeholder</title> <script id="jquery_183" type="text/javascript" class="library" src="C:/Users/Administrator/Desk

ie中placeholder属性不支持,js解决

ie中placeholder属性不支持,js的解决方法: //placeholder属性在ie下兼容 function placeholder ( pEle , con ) { var pEle = pEle if( pEle.find("input,textarea").val() == "" ){ pEle.append("<i class='placeholder_ie'>"+con+"</i>"

HTML5的placeholder 属性的向下兼容

HTML5的placeholder 属性的向下兼容 更多 0 placeholder属性是HTML5新添加的属性,当input或者textarea设置了该属性后,该值的内容将作为灰色提示显示在文本框中,当文本框获得焦点时,提示文字消失,placeholder可作为输入框的提示文案,如图所示登录框: 系统登录 其实以前是通过给input|textarea设置value值来实现类似功能的,当input|textarea获得焦点时,将其value设置为空.但是有一个问题是对于密码输入框: <input

html5的placeholder属性(IE如何兼容placeholder属性)

界面UI推荐 jquery html5 实现placeholder兼容password  IE6 html5的placeholder属性(IE如何兼容placeholder属性) 2013-01-05 10:26:06|  分类: web学习 |  标签:html  js  ie  placeholder  |举报 |字号大中小 订阅 placeholder属性,IE对其的支持表示无奈,firefox.google chrome表示毫无压力. HTML5对Web Form做了许多增强,比如inp

HTML5文件上传组件美化jQuery插件

简要教程 jQuery.filer是一款简单的HTML5文件上传组件美化jQuery插件.它能够完成单文件和多文件的上传,支持文件的拖拽,支持不同的文件格式校验,支持缩略图和图标等,是一款非常实用的文件上传插件.它的特点还有: 对文件上传File Input组件进行美化 支持多文件上传 支持校验文件:大小,扩展名等 支持创建文件的缩略图 每种类型的文件可以自定义图标 可以为缩略图,图标和input自定义模板和主题 可以移出已选择的文件 可以从剪切板粘贴图片 所有的图标在一个字体文件中 支持文件拖

HTML5之placeholder属性以及如何更改placeholder属性中文字颜色

今天在群里看到群友问了一个这样的问题,就是如何更改placeholder属性中文字的颜色,以前用过这属性,却是没更改过颜色,于是便试了试,中途遇到些问题,查找资料后特来总结一下. 熟悉HTML5的人应该都知道,placeholder这个属性是HTML5中新增的属性,该属性的作用是规定可描述输入字段预期值的简短的提示信息,该提示会在用户输入之前显示在输入字段中,会在用户输入字段后消失,有些浏览器则是获得焦点后该提示便消失(如Safari.IE) 适用范围:placeholder 属性适用于下面的

[干货]兼容HTML5的Placeholder属性-更新版v0.10102013

HTML5对Web Form做了许多增强,比如input新增的type类型.Form Validation等.Placeholder是HTML5新增的另一个属性,当input或者textarea设置了该属性后,该值的内容将作为灰字提示显示在文本框中,当文本框获得焦点时,提示文字消失. 这里提供了Placeholder的兼容方法,更新如下: 1.将方法修改为node原生对象的继承对象2.兼容input类型为password的文本框3.提供样式名称作为参数,可以灵活设置样式,修正样式设置一处问题4.

Html5的placeholder属性(IE兼容)

HTML5对Web Form做了很多增强,比方input新增的type类型.Form Validation等. Placeholder是HTML5新增的还有一个属性,当input或者textarea设置了该属性后.该值的内容将作为灰字提示显示在文本框中,当文本框获得焦点时,提示文字消失.曾经要实现这效果都是用JavaScript来控制才干实现 , firefox.google chrome等表示对其支持 , 只有IE存在违和感啊! 比如:  <input id="t1" type

让IE下支持Html5的placeholder属性

HTML5对Web Form做了许多增强,比如input新增的type类型.Form Validation等. Placeholder 是HTML5新增的另一个属性,当input或者textarea设置了该属性后,该值的内容将作为灰字提示显示在文本框中,当文本框获得焦点时,提示文 字消失.以前要实现这效果都是用JavaScript来控制才能实现 , firefox.google chrome等表示对其支持 , 唯独IE存在违和感啊! 例如: <input id="t1" type