Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Копирование с input в input (https://javascript.ru/forum/misc/71755-kopirovanie-s-input-v-input.html)

Murk 10.12.2017 17:09

Копирование с input в input
 
Добрый день! Незнаю как реализовать следующую задачу. Есть 4 поля. Первое поле где полностью пишится Фамилия Имя Отчество, есть второе поле где пишится просто фамилия, третье под имя и четвертое поле под отчество. Как сделать так чтоб при написании первого поля чтоб автоматически заполнялись поля 2,3,4 своим значениями.

рони 10.12.2017 17:13

Murk,
а как определить окончание записи в первое поле?

Murk 10.12.2017 17:31

Цитата:

Сообщение от рони (Сообщение 472505)
Murk,
а как определить окончание записи в первое поле?

Пример: Пишишь в первом поле фамилию Иванов (и оно автоматически пишится во второе поле) ставишь пробел в первом поле и пишишь Иван (и оно автоматом записывается в 3 поле) снова ставишь пробел в первом поле и пишишь Иванович (и оно автоматом в 4 поле записывалось)

рони 10.12.2017 17:33

Murk,
oninput split

Murk 10.12.2017 17:42

Цитата:

Сообщение от рони (Сообщение 472508)
Murk,
oninput split

Честно говоря я незнаю как это реализовать

рони 10.12.2017 17:43

Murk,
рисуйте html
Пожалуйста, отформатируйте свой код!

Для этого его можно заключить в специальные теги: js/css/html и т.п., например:
[js]
... ваш код...
[/js]


О том, как вставить в сообщение исполняемый javascript и html-код, а также о дополнительных возможностях форматирования - читайте http://javascript.ru/formatting.

рони 10.12.2017 17:55

Murk,
<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
 </style>

  <script>
window.addEventListener("DOMContentLoaded", function() {
    var inp = document.querySelector(".in"),
        out = document.querySelectorAll(".out");
        inp.addEventListener("input", function(event) {
        inp.value.split(/\s+/).forEach(function(text,i) {
     out[i] && (out[i].value = text)
});

        })
});
  </script>
</head>

<body>
<input type="text" class="in">
<input type="text" class="out">
<input type="text" class="out">
<input type="text" class="out">

</body>
</html>

Murk 10.12.2017 17:56

Цитата:

Сообщение от рони (Сообщение 472510)
Murk,
рисуйте html
Пожалуйста, отформатируйте свой код!

Для этого его можно заключить в специальные теги: js/css/html и т.п., например:
[js]
... ваш код...
[/js]


О том, как вставить в сообщение исполняемый javascript и html-код, а также о дополнительных возможностях форматирования - читайте http://javascript.ru/formatting.

Меня интересует больше в исполнении js, как написать такой код :cray:

рони 10.12.2017 18:05

Murk,
от вас требовалось написать строки 25-28 хотя бы ... :(

Murk 10.12.2017 20:33

Цитата:

Сообщение от рони (Сообщение 472511)
Murk,
<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
 </style>

  <script>
window.addEventListener("DOMContentLoaded", function() {
    var inp = document.querySelector(".in"),
        out = document.querySelectorAll(".out");
        inp.addEventListener("input", function(event) {
        inp.value.split(/\s+/).forEach(function(text,i) {
     out[i] && (out[i].value = text)
});

        })
});
  </script>
</head>

<body>
<input type="text" class="in">
<input type="text" class="out">
<input type="text" class="out">
<input type="text" class="out">

</body>
</html>

:dance: :dance: СПАСИБО! ЭТО ТО ЧТО НУЖНО!


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