//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);