將多個文本行粘貼到多個html輸入框中

Question

我正在尋找一種讓用戶復制的方法，例如將多行地址粘貼到網頁中，其中每個地址行都有一個輸入字段，這樣不僅粘貼第一行，而且程序會自動粘貼跳到下一個字段，並在其中放置第2行，依此類推。

下面是我好不容易才找到的代碼，但它僅限於字數。在下面的代碼是1 ..有沒有什么辦法，這將不是字數 ，而是由行數 限制

        <input type="text" class="text-input" name="box1"> 
        <input type="text" class="text-input" name="box2"> 


  function handleCharacter(event) {
    var $input = $(this),
        index = getIndex($input),
        digit = $input.val().slice(0,1),
        rest = $input.val().slice(1),
        $next;

    if (rest.length > 0) {
        $input.val(digit);  // trim input value to just one character
        $next = $('.text-input[name="chars['+ (index + 1) +']"]');

        if ($next.length > 0) {
            $next.val(rest);  // push the rest of the value into the next input
            $next.focus();
            handleCharacter.call($next, event);  // run the same code on the next input
        }
    }
}

function handleBackspace(event) {
    var $input = $(this),
        index = getIndex($input),
        $prev;

    // if the user pressed backspace and the input is empty
    if (event.which === 8 && !$(this).val()) {
        $prev = $('.def-txt-input[name="chars['+ (index - 1) +']"]');
        $prev.focus();
    }
}

function getIndex($input) {
    return parseInt($input.attr('name').split(/[\[\]]/)[1], 10);
}

$('.def-txt-input')
    .on('keyup', handleCharacter)
    .on('keydown', handleBackspace);

在此先感謝您的幫助！！！！

Answer 1

我提供了一個textarea，用於粘貼內容，然后拆分行並粘貼到其他框中。

    <textarea class="def-txt-input" id="mainbox">

    </textarea>

    <br/>
    <input type="text" class="text-input" name="box1"> 
    <input type="text" class="text-input" name="box2"> 
    <input type="text" class="text-input" name="box3">
    <input type="text" class="text-input" name="box4">
    <input type="text" class="text-input" name="box5">
    <input type="text" class="text-input" name="box6">



        <script>

            function handleCharacter(event) {
                var longString = $("#mainbox").val();
                var ks = $('#mainbox').val().split("\n");
                //e.preventDefault();

                var inputs = $(".text-input");

                $.each(ks, function(k){
                   //alert(ks[k]);
                   //alert(inputs[k].name);
                   var thisName = inputs[k].name;
                   //$("[name='box1']").val('hi');

                   $('[name="' + thisName + '"]').val(ks[k]);


                });

                console.log(longString);



            }

            $('.def-txt-input')
                .on('keyup', handleCharacter);
               // .on('keydown', handleBackspace);


        </script>