Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Нужна помощь с обработкой в textArea с дублированием на другие поля (https://javascript.ru/forum/dom-window/71273-nuzhna-pomoshh-s-obrabotkojj-v-textarea-s-dublirovaniem-na-drugie-polya.html)

espltd 06.11.2017 11:06

Нужна помощь с обработкой в textArea с дублированием на другие поля
 
Все доброго дня! Подскажите пожалуйста как реализовать.?

Есть у меня textArea, ниже неё есть четыре поля(input).

Как сделать так, чтобы при копипасте в textArea построчного текста такого вида:

слово 1
слово 2
слово 3
слово 4

у меня заполнились 4 поля. В первый инпут попало слово 1, во второй инпут попало слово 2 и т.д. Т.е. скопировал в textArea строки, а программа их разбила и заполнила ниже идущие поля? Заранее,спасибо.

рони 06.11.2017 11:36

espltd,
https://javascript.ru/forum/dom-wind...tml#post316646

espltd 06.11.2017 12:23

принцип то понятен, спасибо. Но вот я не понимаю, а как сделать так чтобы 4 инпута снизу заполнились, не врубился. Можете показать наглядно? Был бы очень благодарен

рони 06.11.2017 12:39

espltd,
:(
<!DOCTYPE HTML>
<html>
  <head>
    <title>example</title>
    <meta charset="utf-8">
  </head>
  <body>
    <textarea style="width: 300px; height: 150px;">text1
text2
text3
text4
</textarea><br/>

    <input type="text" class="out">
    <input type="text" class="out">
    <input type="text" class="out">
    <input type="text" class="out">
<script>

var textarea = document.querySelector('textarea'),
  out   = document.querySelectorAll('input.out');

textarea.oninput = function ()
  {
  var myList = textarea.value.split(/[\r\n]+/);

  for (var i = 0, ln = myList.length; i < ln; ++i)
    out[i] && (out[i].value =myList[i]);
  }
    </script>
  </body>
</html>

espltd 06.11.2017 13:00

спасибо дружище за помощь. выручил)


Часовой пояс GMT +3, время: 19:15.