Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   Отслеживание события при добавлении значения в поле скриптом (https://javascript.ru/forum/events/78649-otslezhivanie-sobytiya-pri-dobavlenii-znacheniya-v-pole-skriptom.html)

dmitry.sh18 14.10.2019 15:48

Отслеживание события при добавлении значения в поле скриптом
 
Добрый день. Есть 3 input поля. В первое поле вручную вводятся данные и при событии onchange запускается скрипт, который по формуле обрабатывает данные из первого поля и помещает результат во второе поле.

Есть также третье поле в которое нужно подставить результаты из второго поля и обработать с помощью формулы. Но проблема в том, что событие onchange на втором поле не срабатывает, если значение добавляется с помощью скрипта (если вводить значение вручную, то скрипт отрабатывает). Как можно это исправить?

рони 14.10.2019 16:15

dmitry.sh18,
зачем отслеживать ввод во второе поле, если у вас уже есть привязка к первому, скрипт который вывел данные во второе поле, может вывести и в третье?

dmitry.sh18 14.10.2019 16:52

не совсем, например, пользователь вводит в поле 1 значение 5, во второе поле должно подставиться значение "поле 1 * 10", т.е. во второе поле мы должны получить число 50, а в третье поле мы должны получить "поле 2 * 10", т.е. 500. Но когда скрипт вводит в поле 2 результаты расчетов, поле 3 его не видит.

laimas 14.10.2019 17:19

Цитата:

Сообщение от dmitry.sh18
не совсем

<input id="a1" />
<input id="a2" readonly="" />
<input id="a3" readonly="" />

<script>
document.getElementById('a1').addEventListener('input', function() {
    this.value = this.value.replace(/\D/,'');
    document.getElementById('a2').value = this.value * 10;
    document.getElementById('a3').value = this.value * 100;    
});
</script>


И что тут не совсем?

рони 14.10.2019 17:21

Цитата:

Сообщение от dmitry.sh18
пользователь вводит в поле 1 значение 5,

вы что-то не договариваите ...
<!DOCTYPE html>

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

</head>

<body>
<input type="text">
<input type="text">
<input type="text">
<script>
	var inp =  document.querySelectorAll('input');
 	inp[0].addEventListener('input', function() {
	inp[1].value = this.value * 10;
    inp[2].value = this.value * 10 * 10;

}, false)
</script>

</body>
</html>

dmitry.sh18 14.10.2019 17:36

Цитата:

Сообщение от laimas (Сообщение 513956)
<input id="a1" />
<input id="a2" readonly="" />
<input id="a3" readonly="" />

<script>
document.getElementById('a1').addEventListener('input', function() {
    this.value = this.value.replace(/\D/,'');
    document.getElementById('a2').value = this.value * 10;
    document.getElementById('a3').value = this.value * 100;    
});
</script>


И что тут не совсем?

Спасибо, то что нужно!

dmitry.sh18 14.10.2019 17:36

Цитата:

Сообщение от рони (Сообщение 513957)
вы что-то не договариваите ...
<!DOCTYPE html>

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

</head>

<body>
<input type="text">
<input type="text">
<input type="text">
<script>
	var inp =  document.querySelectorAll('input');
 	inp[0].addEventListener('input', function() {
	inp[1].value = this.value * 10;
    inp[2].value = this.value * 10 * 10;

}, false)
</script>

</body>
</html>

Спасибо за ответ, именно это и было нужно!


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