jquery实现粘贴16位序列号自动分割填入input的代码

常见的功能，复制验证序列号粘贴自动分割填入当前focus的input及后面input，每个框4个字符。同时实现当复制的内容自由分割后，某个input不足4个字符时，focus在那个input，超过4个字符则focus进入下一个input。

实现代码

HTML代码

<div class="serial">
	<input type="text" class="text" id="input1" value="" maxlength="4" tabindex="1">
	<input type="text" class="text" id="input2" value="" maxlength="4" tabindex="2">
	<input type="text" class="text" id="input3" value="" maxlength="4" tabindex="3">
	<input type="text" class="text" id="input4" value="" maxlength="4" tabindex="4">
</div>

jQuery代码

$('.serial .text').on('paste', function(event){ 
	event.preventDefault();
	var copydata = event.originalEvent.clipboardData;
	var pastedata = copydata.getData('text').replace(/[\s!@#$%^&*()_+\-=\[\]{};':"\\|,.<>\/?]+/g, '');
	var result = [];
	for (let i = 0; i < pastedata.length; i += 4) {
		result.push(pastedata.substr(i, 4));
	}
	var _rlen = result.length;
	var _index = $(this).index();
	var _focus = result[_rlen-1].length > 3 ? (_rlen + _index) : (_rlen + _index - 1);            
	if(_index > 0){
		$('.serial .text').eq(_index-1).nextAll('.text').each(function(e){
			$(this).val(result[e]);
		});                
	}else{
		$('.serial .text').each(function(e){
			$(this).val(result[e]);
		});
	}
	$('.serial .text').eq(_focus).focus();
});
$('.serial .text').on('input propertychange',function(){                
	if($(this).val().length > 3){
		$(this).next().focus();
	}
});