Какое происходит событие?

Question

[Mountain Programmer]

Есть input, в который вставляется текст с помощью js
Например так:

<input id="sss" type="text"> oninput: <span id="result"></span>
<script>

    function ss() {
        document.querySelector('#sss').value = 'sss';
    }

</script>

Вызываю функцию
ss();
Теперь хочу отловить изменение инпута:

<script>
    
    var input = document.querySelector('#sss');
    
    input.oninput = function() {
        document.getElementById('result').innerHTML = input.value;
    };
    
</script>

Но oninput не срабатывает (( и onchange тоже ((

Подскажите знающие - как отловить изменение инпута? При этом важно, чтоб отлов изменения происходил именно во вне функции ss()

Comments

[Станислав]

Используй setTimeout когда нужно получить данные из инпута

[Mountain Programmer]

Станислав, setInterval - и постоянно проверять value.length ?

[Станислав]

Mountain Programmer, зачем? Я предложил вариант с помощью которого можно получить значение инпута после его заполнения тем же JS, если нужно чекать при вводе инпут, то есть для этого keyup к примеру. В топике вы просто не пояснили что именно вам нужно сделать

[Mountain Programmer]

Станислав, я не понимаю как? Мне нужно чтоб после того, как инпут будет заполнен, запускался другой скрипт.

[Станислав]

Mountain Programmer, так кто его будет заполнять? Пользователь? Или как в топике JS? И какая цель другой функции? Проверка содержимого поля input? или отправка данных на сервер? Или еще какие то махинации? Просто что вам нужно то? Чего вы добиваетесь? =)

[Mountain Programmer]

Станислав, цель проста - после того, как с помощью скрипта будет заполнено поле, пойдет запрос на сервер, с данными из этого поля, но поле будет заполнено именно скриптом, а не пользователем.

[Станислав]

Mountain Programmer, А зачем вобще тогда инпут нужен? Не проще ли сразу данные на сервер отправить?
Вот то что вам нужно, там и пример есть
https://learn.javascript.ru/introduction-browser-events
Ну а если нужно взять данные после того как JS вставил данные в input и без привязки к функции вставки, тогда используйте то что я написал выше (setTimeout)

setTimeout(function(){
  alert(document.querySelector('#sss').value)
}, 2000) // через 2 секунды выполнится этот код

Только я не вижу смысла в этом, мазахизмом попахивает =)

[Mountain Programmer]

Станислав, Вы меня наверное не правильно поняли, вот есть код:

<input id="sss" type="text"> oninput: <span id="result"></span>
<button onclick="func_1();">button</button>
<script>

    function func_1() {
        document.querySelector('#sss').value = 'sss';
    }

</script>

Пользователь кликает по кнопке - вызыватся функция func_1 и текст вставляется в инпут
После этого надо чтоб сработала другая функция func_2:

<script>

    var input = document.querySelector('#sss');

    function func_2() {
        document.getElementById('result').innerHTML = input.value;
    }

    input.onchange = function() {
        func_2();
    };


</script>

Как мне в этом случае поможет setTimeout ?

[Станислав]

Mountain Programmer, https://jsfiddle.net/webphp/fu42e3sc/

[Mountain Programmer]

Станислав, Так я тоже могу, но надо чтоб, в вашем случае, функция run(), запускалась не внутри обработчика

document.querySelector('button').addEventListener('click', function() {
	var e = document.querySelector('input');
  e.value = 'какой то текст', run()
})

а во вне оного, но после того, как в инпуте появится тест

document.querySelector('button').addEventListener('click', function() {
	var e = document.querySelector('input');
  e.value = 'какой то текст'
  
})
run()

Answer 1

[Леонид]

Никакого события не вызывается. Почему бы не сгенерировать его самостоятельно?