zoukankan      html  css  js  c++  java
  • placeHolder 兼容所有浏览器

    //placeHolder 插件
    (function($){
    
        $.fn.placeHolder=function(options){
            if(typeof options == "string"){
                return $.fn.placeHolder.methods[options](this);
            }
            options = options || {};
    
            return this.each(function(){
                var setting = $.data(this, "placeholder");
                if(setting){
                    setting = $.extend(setting, options);    
                }else{
                    var opts = $.extend({}, $.fn.placeHolder.defaults, options),
                        self = this;
                    opts = {options : opts, label : $('<label>')}
                    $.data(this, "placeHolder", opts);
    
                    setTimeout(function(){
                        create(self, opts);
                    })
                }
            })
        };
    
        if ('placeholder' in document.createElement('INPUT')){
            $.fn.placeHolder = function(){}
        }
    
        function create(target,opts){
    
            var _self = $(target),
                _placeholder = _self.attr('placeholder'),
                _label = opts.label,
                _div = $('<div>'),
                _className = opts.options.className;
    
            if(typeof _placeholder === 'undefined'){
                return
            }
    
            _label.addClass(_className).
                html(_placeholder).
                appendTo(_div).
                click(function () {
                    _self.get(0).focus();
                });
            _label.get(0).oncontextmenu = function(event){
                _self.get(0).focus();
            };
            _div.css({position:"relative"}).insertAfter(_self);
            bindPlaceHolder( target );
            if(_self.val().length > 0){
                _self.placeHolder('hide');
            }
        };
    
        function toggleHolder(){
            var self = this;
            setTimeout(function(){
                var type = self.value == '' ? 'show' : 'hide';
                $(self).placeHolder( type );
            },0)
        }
    
    
        function bindPlaceHolder( target ){
            $(target).on('keyup blur cut paste change', toggleHolder)
        }
    
        $.fn.placeHolder.methods = {
            show:function(jq){
                return jq.each(function(){
                    $(this).data("placeHolder").label.show();
                });
            },
            hide:function(jq){
                return jq.each(function(){
                    $(this).data("placeHolder").label.hide();
                });
            }
        };
    
        $.fn.placeHolder.defaults  = {className:'placeholder'};
    
    })(jQuery);
  • 相关阅读:
    webservice测试工具
    Spring+CXF整合来管理webservice(服务器启动发布webservice)
    BAT常用命令
    【shell入门】Shell用法
    【shell】Shell命令合集(0)
    挨踢江湖之十二
    shell一些笔记
    在优化SQL语句中使用虚拟索引
    Jenkins Maven打包出错异常的解决方法
    [置顶] ios 360度旋转效果demo
  • 原文地址:https://www.cnblogs.com/bjmumu/p/3408646.html
Copyright © 2011-2022 走看看