Javascript manuell feuern .onchange() Ereignis

Question

Ich habe ein Eingabefeld Ich möchte einen neuen Wert zuweisen und ein .onchange() Ereignis auslösen. Ich tat folgendes:

document.getElementById("range").value='500'; 
document.getElementById("range").onchange(); 

Wo Bereich ist meine Eingabe Id. bekomme ich folgende Fehlermeldung:

Uncaught TypeError: Cannot read property 'target' of undefined 

Gibt es eine Möglichkeit, das ‚Ziel‘ zu definieren? Danke

Answer 1

Der Fehler über target liegt daran, dass im Ereignishandler Code vorhanden ist, der versucht, die target-Eigenschaft des Objekts Event zu lesen, das dem Änderungsereignis zugeordnet ist. Sie könnten versuchen, in einem faux-Ereignis vorbei, es zu täuschen:

var range= document.getElementById('range'); 
range.onchange({target: range}); 

oder, wenn Sie können, den Handler-Code ändern this statt event.target zu verwenden.Wenn Sie keine Delegierung verwenden (Änderungsereignisse für untergeordnetes Objekt von einem übergeordneten Element abfangen, was für Änderungsereignisse problematisch ist, weil der IE sie nicht "sprudelt"), ist das Ziel des Änderungsereignisses immer das Element des Ereignisbehandlers wurde registriert und macht event.target überflüssig.

Wenn der Event-Handler mehr Eigenschaften von Event als nur target verwendet, müssten Sie mehr fälschen, oder gehen Sie für die "echte" Browser-Schnittstelle zum Versenden von Ereignissen. Dies ist auch erforderlich, wenn Event-Listener möglicherweise verwendet werden (addEventListener oder attachEvent in IE), da sie auf der direkten onchange-Eigenschaft nicht sichtbar sind. Dies ist Browser-abhängig (fireEvent für IE, dispatchEvent für Standards) und nicht für ältere oder obskure Browser verfügbar.

Answer 2

Versuchen Sie es mit fireEvent oder dispatch (je nach Browser), um das Ereignis zu erhöhen:

document.getElementById("range").value='500'; 
if (document.getElementById("range").fireEvent) { 
    document.getElementById("range").fireEvent("onclick"); 
} else if (document.getElementById("range").dispatchEvent) { 
    var clickevent=document.createEvent("MouseEvents"); 
    clickevent.initEvent("click", true, true); 
    document.getElementById("range").dispatchEvent(clickevent); 
} 

Answer 3

Dies scheint für mich zu arbeiten (siehe diese fiddle). Haben Sie einen anderen Code, der das Problem sein könnte? Wie haben Sie Ihren Onchange-Handler definiert?

Rufen Sie e.target in Ihrem Onchange-Handler auf? Ich vermute, dies könnte das Problem sein ... da Sie die Änderung programmatisch durchführen, gibt es kein entsprechendes Fensterereignis.

Answer 4

aus: http://www.mail-archive.com/jquery-en@googlegroups.com/msg44887.html

Sometimes it's needed to create an event programmatically. (Which is different from running an event function (triggering)

This can be done by the following fire code

> var el=document.getElementById("ID1") 
> 
> fire(el,'change') 
> 
> 
> function fire(evttype) { 
>  if (document.createEvent) { 
>   var evt = document.createEvent('HTMLEvents'); 
>   evt.initEvent(evttype, false, false); 
>   el.dispatchEvent(evt); 
>  } else if (document.createEventObject) { 
>   el.fireEvent('on' + evttype); 
>  } } looks like this trick is not yet in jQuery, perhaps for a 
> reason? 

Answer 5

Fein Im Allgemeinen sollten Sie den Code arbeiten. Es könnte aber auch etwas anderes geben, das das Problem verursacht.

• Wohin führen Sie diese beiden Linien?
• Sind Sie sicher, dass das Element mit der range id durch die Zeit geladen wird Sie den Code ausführen (z Sie es in document.ready laufen).
• Sind Sie sicher, dass Sie nur ein Element mit ID range auf der Seite haben?
• Was ist Ihre onchange() Funktion tun (könnte hilfreich sein, es hier zu posten)?

Abgesehen davon, würde ich mit jQuery (wenn möglich) empfehlen:

$('#range').trigger('change'); 

oder nur

$('#range').change(); 

http://api.jquery.com/change/

Aber wie ich bereits erwähnt, sollte Ihr Fall arbeiten gut auch: http://jehiah.cz/a/firing-javascript-events-properly