javascript - Hur kan jag trigga ett onchange-evenemang manuellt?
Jag sätter ett datum- och tidsfältvärde via en kalenderwidget. Uppenbarligen gör kalenderwidgeten något liknande detta:
document.getElementById('datetimetext').value = date_value;
Det jag vill är:
När värdet ändras i datum- och tidsfältet behöver jag återställa några andra fält på sidan. Jag har lagt till en onchange-händelselyssnare på datetimetext-fältet som inte utlöses, eftersom jag antar att onchange bara utlöses när elementet får fokus och dess värde ändras när det förlorar fokus.
Därför letar jag efter ett sätt att manuellt utlösa denna onchange händelse (vilket jag antar bör ta hand om att kontrollera värdeskillnaden i textfältet).
Några idéer?
Svar #1
MDN föreslår att det finns ett mycket renare sätt att göra detta i moderna webbläsare:
// Assuming we're listening for e.g. a 'change' event on `element`
// Create a new 'change' event
var event = new Event('change');
// Dispatch it.
element.dispatchEvent(event);
Svar #2
Det finns ett par sätt du kan göra detta på. Om onchange-lyssnaren är en funktion som är inställd via element.onchange-egenskapen och du inte bryr dig om händelseobjektet eller bubbla/propagering, är det enklaste sättet att helt enkelt anropa den funktionen:
element.onchange();
Om du behöver det för att simulera det verkliga evenemanget i sin helhet, eller om du ställer in evenemanget via HTML-attributet eller addEventListener/attachEvent, behöver du göra lite funktionsdetektion för att korrekt utlösa evenemanget:
if ("createEvent" in document) {
var evt = document.createEvent("HTMLEvents");
evt.initEvent("change", false, true);
element.dispatchEvent(evt);
}
else
element.fireEvent("onchange");
