Pasting multiple numbers over multiple input fields

后端 未结 5 1889
独厮守ぢ
独厮守ぢ 2020-12-17 01:58

I\'ve got a form on my site using 6 input fields. The site visitor simply enters a 6 digit code into these 6 boxes. The thing is that they\'ll get the 6 digit code and it

5条回答
  •  余生分开走
    2020-12-17 02:15

    Here is an example of a jquery plugin that does the same thing as the original answer only generalized.

    I went to great lengths to modify the original answer ( http://jsfiddle.net/D7jVR/ ) to a jquery plugin and the source code is here: https://github.com/relipse/jquery-pastehopacross/blob/master/jquery.pastehopacross.js

    An example of this on jsfiddle is here: http://jsfiddle.net/D7jVR/111/

    The source as of 4-Apr-2013 is below:

    /**
     * PasteHopAcross jquery plugin
     * Paste across multiple inputs plugin, 
     * inspired by http://jsfiddle.net/D7jVR/
     */
    (function ($) {
        jQuery.fn.pastehopacross = function(opts){ 
           if (!opts){ opts = {} }
            if (!opts.regexRemove){
                opts.regexRemove = false;   
            }
            if (!opts.inputs){
               opts.inputs = [];   
            }
            if (opts.inputs.length == 0){
                //return 
                return $(this);   
            }
    
            if (!opts.first_maxlength){
                opts.first_maxlength = $(this).attr('maxlength');
                if (!opts.first_maxlength){
                    return $(this);
                }
            }
    
           $(this).on('paste', function(){
    
               //remove maxlength attribute
               $(this).removeAttr('maxlength'); 
               $(this).one("input.fromPaste", function(){
                   var $firstBox = $(this);
    
                    var pastedValue = $(this).val();
                    if (opts.regexRemove){
                         pastedValue = pastedValue.replace(opts.regexRemove, "");
                    }
    
                    var str_pv = pastedValue;
                    $(opts.inputs).each(function(){
                        var pv = str_pv.split('');
                        var maxlength;
                        if ($firstBox.get(0) == this){
                           maxlength = opts.first_maxlength;   
                        }else{
                           maxlength = $(this).attr('maxlength'); 
                        }
                        if (maxlength == undefined){
                            //paste them all!
                            maxlength = pv.length;   
                        }
                        //clear the value
                        $(this).val('');
                        var nwval = '';           
                        for (var i = 0; i < maxlength; ++i){
                            if (typeof(pv[i]) != 'undefined'){
                               nwval += pv[i];
                            }
                        }
                        $(this).val(nwval);
                        //remove everything from earlier
                        str_pv = str_pv.substring(maxlength);
                    });
    
                    //restore maxlength attribute
                    $(this).attr('maxlength', opts.first_maxlength);
                });    
    
           });
    
           return $(this);
        }
    })(jQuery);
    

提交回复
热议问题