调用时直接引用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实现的更多相关文章

  1. 改进《完美让IE兼容input placeholder属性的jquery实现》的不完美

    <完美让IE兼容input placeholder属性的jquery实现>中的代码在IE9以下浏览器中会出错,原因是因为ie9以下的浏览器对input的标签的解释不同. 例如对以下文本框的 ...

  2. HTML 5 <input> placeholder 属性

    原文链接:http://www.w3school.com.cn/html5/att_input_placeholder.asp HTML 5 <input> placeholder 属性 ...

  3. 兼容的placeholder属性

    作为一个.net后台开发的程序猿,博客里既然大多都是前端相关的博文.是不是该考虑换方向了,转前端开发得了 ... 小小吐槽一下,近期受该不该跳槽所困惑,我有选择困难症! 继续前端,这次说一下输入框 p ...

  4. input placeholder属性 样式修改(颜色,大小,位置)

    placeholder属性 样式修改 <!DOCTYPE html> <html> <head> <meta charset="utf-8" ...

  5. HTML 5 <input> placeholder 属性 实现搜索框提示文字点击输入后消失

    H5之前要实现这个功能还要用到JS,H5出来之后新增加了placeholder属性,有了这个属性就就能轻松实现这个功能. 定义和用法 placeholder 属性提供可描述输入字段预期值的提示信息(h ...

  6. Html5 input placeholder 属性字体颜色修改。

    这篇文章主要介绍了有关HTML5 input placeholder 颜色修改方面的知识,需要的朋友可以参考下     Chrome支持input=[type=text]占位文本属性,但下列CSS样式 ...

  7. HTML <input> placeholder 属性

    css ::-webkit-input-placeholder { /* WebKit, Blink, Edge */ color: #909; } :-moz-placeholder { /* Mo ...

  8. input placeholder属性IE、360浏览器兼容性问题

    效果:http://hovertree.com/texiao/jquery/43/ 效果二:http://hovertree.com/texiao/jquery/43/1/ 请在IE中体验. 1.创建 ...

  9. html5 <input> placeholder 属性

    带有 placeholder 文本的搜索字段: <form action="demo_form.asp" method="get"> <inp ...

随机推荐

  1. VM Depot 镜像新增系列II – 学习管理系统,内容管理系统以及平台管理工具

     发布于 2014-06-23 作者 刘 天栋 继上周企业管理软件和电子商务镜像的加盟之后,我们看到又有一批内容管理解决方案(CMS),学习管理解决方案(LMS)以及平台管理工具 (如 Open ...

  2. OA请假流程 -- 编码

    OA请假流程 -- 编码 凡是内容不会发生变化的,都要写在xml配置文件中.需要定义如下内容: <process>标签 id英文命名 和 name 中文命名,然后只要与该流程相关的资源均以 ...

  3. 有关Ant编译

    今天给一个项目做jar包,从之前的项目拷贝了build文件,改了改,运行,结果有问题.编译时不打出任何信息,也不报错,从目标文件看,似乎拷贝等任务都执行了,但是编译没有执行.网上Google结果都说是 ...

  4. 使用GPUImage开启的相机进行摄像,保存写入到Path

    之前已经有一篇博客讲过怎么开启摄像头并完成对摄像头的图像的滤镜化了,现在就说说怎么录像,并把这个添加滤镜的录像文件写到Path 原理是GPUImage给出了GPUImageMovieWriter这么个 ...

  5. ACM1019_最大公倍数

    /*问题说明 一组正整数的最小公倍数(LCM)是最小的正整数约数集合中的所有号码. 例如,5,7和15的最小公倍数是105. 输入 输入将包括多个问题的实例.输入的第一行中,将包含一个整数, 表示问题 ...

  6. 更改Tomcat startup.bat启动窗口名称

    通常在Tomcat bin目录下用startup.bat启动Tomcat ,启动窗口显示的Title是Tomcat 如果遇到一个服务器上多个Tomcat的话就会容易混淆.更改方法如下: 1 在bin目 ...

  7. 如何将位图格式图片文件(.bmp)生成geotiff格式图片?

    一.位图格式信息 位图BITMAPINFOHEADER 与BITMAPFILEHEADER: 先来看BITMAPINFOHEADER,只写几个主要的 biSize包含的是这个结构体的大小(包括颜色表) ...

  8. Android RecyclerView使用(一)

    RecyclerView一种可以替换掉listview gridview 瀑布流等控件的新视图控件,控制视图回收和复用 ==优化内存可以替换listview 与listview的不同之处是:listv ...

  9. 了解Unicode编码

    制定Unicode编码标准的组织有两个,一个是国际标准化组织ISO,一个是多语言软件制造商组成的统一码联盟. 通用字符集UCS(Universal Character Set)是由ISO制定的编码方案 ...

  10. Linux软件安装,RPM与YUM

    为了防止无良网站的爬虫抓取文章,特此标识,转载请注明文章出处.LaplaceDemon/SJQ. http://www.cnblogs.com/shijiaqi1066/p/3843955.html ...