EN
JavaScript - fire onchange event manually
5 points
In this short article, we would like to show you how to fire onchange evet manually in JavaScript.
Quick solution:
xxxxxxxxxx1
element.dispatchEvent(new Event('change'));
xxxxxxxxxx1
2
<html>3
<head>4
<script>5
6
var dispatchEvent = function(element, event) {7
element.dispatchEvent(new Event(event));8
};9
10
</script>11
</head>12
<body>13
<input id="element" value="Old value ..." onchange="console.log('onchange event fired!')" />14
<script>15
16
var element = document.querySelector('#element');17
18
element.addEventListener('change', function() {19
console.log('onchange event fired!');20
});21
22
23
// Usage example:24
25
function changeValue() {26
element.value = 'New value ...';27
dispatchEvent(element, 'change'); // <------ fires an event simulating a change in values28
}29
30
setTimeout(changeValue, 1000);31
32
</script>33
</body>34
</html>
