Как реализовать метод .change на js?

Question

[artekha]

Как реализовать метод el.change() на на чистом javascript?

$("input").change(function(){
    alert("The text has been changed.");
});

Answer 1

[WebDev]

www.w3schools.com/jsref/event_onchange.asp

Answer 2

[Finesse]

Если полей ввода больше одного или неизвестно сколько:

var inputs = document.querySelectorAll( "input" );

for ( var i = 0; i < inputs.length; ++i ) {
    inputs[ i ].addEventListener( 'change', function() {
        alert("The text has been changed.");
    });
}

Если поле ввода всегда одно:

document.querySelector( "input" ).addEventListener( 'change', function() {
    alert("The text has been changed.");
});

Comments

[Сергей]

Note: The addEventListener() method is not supported in Internet Explorer 8 and earlier versions, and Opera 6.0 and earlier versions. However, for these specific browser versions, you can use the attachEvent() method to attach event handlers

[Finesse]

void01: Эти браузеры уже давно устарели. Но если всё-таки нужно, то можно сделать так: `var input = document.getElementsByTagName( "input" )[ 0 ]; (input.addEventListener || input.attachEvent)( "change", ...'`. Ваш вариант не совсем удачен, потому что, во-первых, если 2 раза вызвать такой код, то слушатель, установленный в первый раз, пропадёт, (jQuery-метод change не имеет этого недостатка), а во-вторых, `document.getElementsByTagName` возвращает список элементов, поэтому добавлять к нему `onchange` бесполезно.

Answer 3

[Сергей]

document.getElementsByTagName("INPUT").onchange = function(){
alert("The text has been changed.");
}