javascript - 自动填充多个字段的 jQuery 库

标签 javascript jquery

我有多个设置了字符限制的文本框,它们共同组成了一个代码。由于各种原因,将盒子分开是有值(value)的。我希望能够在第一个文本框中粘贴完整的代码并让它自动填充所有文本框。对于这种情况,有没有办法在 javascript 或 jquery 库中执行此操作?

目前我在每个文本框上使用 jQuery 自动制表符,我希望保留该功能。

最佳答案

DEMO

使用 onpaste 事件从用户的剪贴板中捕获数据。然后获取该数据并生成适合您的输入的数组。然后使用 .val()

设置这些值

JS

$(function(){

    // get first input element
    pastable = document.getElementById('pastable');          
    // listen for the user to paste
    pastable.onpaste = function(e){
        // retrieve paste data as an array split to each 3 characters (3 dots below in regex)
        var inputArray = e.clipboardData.getData('text/plain').match(/.../g);
        // loop over input fields
        $('input').each(function(i){
             // place data from paste
             $(this).val(inputArray[i]);                
        });
    };

});​

HTML

<input type='text' id="pastable" maxlength="3"/>
<input type='text' maxlength="3" />
<input type='text' maxlength="3" />​

关于javascript - 自动填充多个字段的 jQuery 库,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13594238/

相关文章:

jquery - 调整 bootgrid 中的列大小

javascript - 无限滚动后外部 JS 文件函数未加载

javascript - 如何使用带有过滤器的数据表创建 javascript 分页

c# - 将 C# 对象转换为 JSON 或 Javascript 对象

javascript - 为什么我无法按下 alt 键?

javascript - 在对话框中重置 JQuery 验证

php-jquery 自动完成数据库中的文本框

javascript - 优化使用 jQuery 将 <li> 附加到 <ul> 中

javascript - 如何在浏览器中进行视频捕获?

javascript - 在 gulp 任务中使用 Inkscape 处理 SVG 时遇到问题