js input placeholder自动变值

(function ($) {  
    $.fn.__Placeholder = function (options) {
        this.el = $(this);
        this.options = options;
        this.fade_i = 0;
        this.defualtsArray = ['fancy-hummingbird','amusing-meerkat','efficient-manatee','complete-otter','delicious-goat','mammoth-toad','mellow-spider','profuse-hummingbird','near-otter','delicious-eagle'];
        //初始化方法  
        this._init = function(){
            this._start();
        }
        this._start = function (){
            var _this = this;
            _this._placeholder = _this.el.attr('placeholder');
            if(!_this._placeholder){
                _this._placeholder = _this.defualtsArray[this._getRandom(_this.defualtsArray.length-1)];
                _this._showPlaceholder(_this._placeholder);
            }else{
                _this._placeholder = _this.defualtsArray[_this._getRandom(_this.defualtsArray.length-1)];
                setTimeout(function (){
                    _this._showPlaceholder(_this._placeholder);
                },5000);
            }
        }
        this._showPlaceholder = function (_content){
            var _this = this,
                contentLength = _content.length;
            if(_this.fade_i < contentLength){
                _this.el.attr('placeholder',_content.substring(0,_this.fade_i));
                _this.fade_i = _this.fade_i + 1;
                setTimeout(function (){
                    _this._showPlaceholder(_content);
                },35);
            }else{
                _this.fade_i = 0;
                _this._start();
            }
        }
        this._getRandom = function (n){
            return Math.floor(Math.random()*n+1);
        }
        this.el.on('input', function(){
            //输入
        });
        this.getValue = function(){
            var value = this.el.val();
            if(value == ''){
                value = this.el.attr('placeholder');
            }
            console.log(value);
        }
        this._init();
        return this;  
    };  
})(jQuery); 

转载于:https://my.oschina.net/u/1858920/blog/712442

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值