1. [代码][JavaScript]代码

(function ($) {
    $.fn.placeholder = function (options) {
        var defaults = {
            pColor: "#ccc",
            pActive: "#999",
            pFont: "14px",
            activeBorder: "#080",
            posL: 8,
            zIndex: "99"
        },
        opts = $.extend(defaults, options);
        //
        return this.each(function () {
            if ("placeholder" in document.createElement("input")) return;
            $(this).parent().css("position", "relative");
            var isIE = $.browser.msie,
            version = $.browser.version;
  
            //不支持placeholder的浏览器
            var $this = $(this),
                msg = $this.attr("placeholder"),
                iH = $this.outerHeight(),
                iW = $this.outerWidth(),
                iX = $this.position().left,
                iY = $this.position().top,
                oInput = $("<label>", {
                "class": "test",
                "text": msg,
                "css": {
                    "position": "absolute",
                    "left": iX + "px",
                    "top": iY + "px",
                    "width": iW - opts.posL + "px",
                    "padding-left": opts.posL + "px",
                    "height": iH + "px",
                    "line-height": iH + "px",
                    "color": opts.pColor,
                    "font-size": opts.pFont,
                    "z-index": opts.zIndex,
                    "cursor": "text"
                }
                }).insertBefore($this);
            //初始状态就有内容
            var value = $this.val();
            if (value.length > 0) {
            oInput.hide();
            };
  
            //
            $this.on("focus", function () {
                var value = $(this).val();
                if (value.length > 0) {
                    oInput.hide();
                }
                oInput.css("color", opts.pActive);
                //
  
                if(isIE && version < 9){
                    var myEvent = "propertychange";
                }else{http://www.huiyi8.com/hunsha/lifu/​
                    var myEvent = "input";
                }婚纱礼服欣赏
  
                $(this).on(myEvent, function () {
                    var value = $(this).val();
                    if (value.length == 0) {
                        oInput.show();
                    } else {
                        oInput.hide();
                    }
                });
  
            }).on("blur", function () {
                var value = $(this).val();
                if (value.length == 0) {
                    oInput.css("color", opts.pColor).show();
                }
            });
            //
            oInput.on("click", function () {
                $this.trigger("focus");
                $(this).css("color", opts.pActive)
            });
            //
            $this.filter(":focus").trigger("focus");
        });
    }
})(jQuery)
2. [代码]调用方法:  
//解决IE下不支持placeholder
if($.browser.msie) { 
$(":input[placeholder]").each(function(){
$(this).placeholder();
});
}

IE不支持HTML5表单属性placeholder的解决办法的更多相关文章

  1. 服务器变量 超级全局数组$_SERVER (附加超简单表单与html5表单属性)

    001.html <html> <head><title>user log</title> <meta http-equiv="cont ...

  2. HTML5: HTML5 表单属性

    ylbtech-HTML5: HTML5 表单属性 1.返回顶部 1. HTML5 表单属性 HTML5 新的表单属性 HTML5 的 <form> 和 <input>标签添加 ...

  3. 兼容IE8以下浏览器input表单属性placeholder不能智能提示功能

    当前很多表单提示使用了表单属性placeholder,可这属性不兼容IE8以下的浏览器,我自己写了一个兼容处理js // 兼容IE8以下浏览器input不能智能提示功能 if(navigator.ap ...

  4. java表单重复提交常用解决办法

    最近在看些基础的东西,顺便做下笔记.相信大家在平时网页使用中,经常会有按钮重复点击,然后点不动刷新,还有当网络延时比较厉害点了没反应在点击的重复提交.为了避免这种情况,总结了一下4点处理方案 表单重复 ...

  5. HTML5表单提示placeholder属性兼容IE

    placeholder 属性提供可描述输入字段预期值的提示信息(hint). 该提示会在输入字段为空时显示,并会在字段获得焦点时消失. 注释:placeholder 属性适用于以下的 <inpu ...

  6. HTML5 表单属性

    form 属性 form 属性规定输入域所属的一个或多个表单. 注释:form 属性适用于所有 <input> 标签的类型. form 属性必须引用所属表单的 id: 实例 <for ...

  7. 微信自带浏览器不支持form表单post提交方案解决

      微信自带浏览器form表单post提交,Java控制后台获取不到值得解决方案: 第一种:把post改成get请求,但是改后另一个问题来了就是,数据不安全了,连接上都能看到,导致数据会流失,Java ...

  8. 针对在webview模式中,小米魅族手机不支持html5原生video的control的解决办法![原创]

    其实,解决办法就是,重新写个control控制功能,.同样用流行的video.js可以实现 第一步就是增加个播放的图片..要不然没有按钮多难看! <div class="videoDi ...

  9. Class 'Illuminate\Html\HtmlServiceProvider' not found或者form表单不能正常使用解决办法

    在laravel框架中,form不能正常使用如何处理. 网上搜到的解决方案通常都是一致的,下面分类考虑: 1,打开根目录composer.json 文件, require 里面增加: 如果larave ...

随机推荐

  1. 上传项目至svn服务器,从svn上获取项目

    1.在桌面右键->TortoiseSVn->Repo_brower->输入地址,进入 ,ok 2.在地址目录上右键==>>add folder==>>选择你要 ...

  2. centos网络配置实例

    1.配置DNS vim   /etc/resolv.conf nameserver 192.168.0.1 nameserver 8.8.8.8 nameserver 8.8.4.4 2.配置网关 r ...

  3. vue-cil 和 webpack 中本地静态图片的路径问题解决方案

    1.小于8K的图片将直接以base64的形式内联在代码中,可以减少一次http请求. 2.大于8k的呢?则直接file-loader打包, 这里并没有写明file-loader.但是确实是需要安装,否 ...

  4. poj1649 Rescue(BFS+优先队列)

    Rescue Time Limit: 2 Seconds      Memory Limit: 65536 KB Angel was caught by the MOLIGPY! He was put ...

  5. Hibernate “N+1”查询问题

    Hibernate 默认情况下使用立即检索策略,即从数据库加载A对象时  会同时加载跟它关联的B,这样产生了不必要的对象集合查询,而且本来可以合并的sql要执行1+N次,因为一条select出所有的A ...

  6. redis客户端连接,最大连接数查询与设置

    ##redis客户端连接数 redis通过监听一个TCP端口或socket的方式接收来自客户端的连接, 当与客户端建立连接后,redis内部会进行如下操作:()客户端socket会被设置为非阻塞模式, ...

  7. Oracle学习第一篇—安装和简单语句

    一 安装  10G ----不适合Win7 Visual Machine-++++Visual Hard Disk 先安装介质(VM)---便于删除 11G-----适合Win7 1 把win64_1 ...

  8. python 基础 2.4 while 循环

    #/usr/bin/python #coding=utf-8 #@Time :2017/10/18 15:31 #@Auther :liuzhenchuan #@File :while 循环.py 示 ...

  9. springcloud和kubernetes对比

    由于这两个都不熟,所以在考虑学哪个. 先说结论:都要学,但是重点学k8s,k8s是一个更加完善的解决方案,springcloud被淘汰只是时间的问题. 从自己的经历和网上的文章两方面分析 个人经历: ...

  10. Python 字符串操作(截取/替换/查找/分割)

    Python 截取字符串使用 变量[头下标:尾下标],就可以截取相应的字符串,其中下标是从0开始算起,可以是正数或负数,下标可以为空表示取到头或尾. # 例1:字符串截取 str = '1234567 ...