Trigger ein keypress/keydown/keyup-event in JS/jQuery?

Was ist der beste Weg, um zu simulieren, ein Benutzer die Eingabe von text in einem text-input Feld in JS und/oder jQuery?

Ich dont wollen eigentlich einen text in das Eingabefeld ein, ich will nur auslösen das Ereignis Handler, die normalerweise ausgelöst durch eine Benutzer-Eingabe von Information in ein Eingabefeld. Dies bedeutet, Fokus, keydown, keypress, keyup und Unschärfe. Ich denke.

Also wie könnte man dies erreichen?

InformationsquelleAutor Alex | 2010-07-30

223

Können Sie die trigger-Ereignisse mit einem direkten Anruf, um Sie, wie dieses:
```
$(function() {
    $('item').keydown();
    $('item').keypress();
    $('item').keyup();
    $('item').blur();
});
```
Tut, tun, was Sie zu tun versuchen?

Sollte man wohl auch auslösen .focus() und potenziell .change()

Wenn Sie wollen, um die trigger-key-Ereignisse mit bestimmten Tasten, die Sie tun können, so wie diese:
```
$(function() {
    var e = $.Event('keypress');
    e.which = 65; //Character 'A'
    $('item').trigger(e);
});
```
Gibt es einige interessante Diskussion, die keypress-events hier: jQuery Ereignis Keypress: Welche Taste wurde gedrückt?, insbesondere hinsichtlich cross-browser Kompatibilität mit der .die Eigenschaft.

oder $('item').trigger('keypress', {which: 'A'.charCodeAt(0)});
Nur als info jsfiddle.net/rickj33/3fby0nzr auch dies funktionierte für mich
Können Sie code schreiben, mit Javascript (ohne jquery).
Wenn Sie brauchen, Strg: ctrlKey: true auch: shiftKey, altKey

InformationsquelleAutor ebynum
29

Auslösen enter keypress, ich hatte zu ändern @ebynum Antwort, insbesondere über die keyCode-Eigenschaft.
```
e = $.Event('keyup');
e.keyCode= 13; //enter
$('input').trigger(e);
```
keydown Ereignis nicht erwischt zu werden, oder mache ich etwas falsch hier? fiddle.jshell.net/Palestinian/8d8J9
der Grund war es nicht so funktioniert, wie Sie waren verbindlich, die Veranstaltung nach auslösen des Ereignisses. einfach binden Sie das Ereignis, bevor Sie das Ereignis auszulösen. überprüfen Sie dies: fiddle.jshell.net/8d8J9/13
es funktioniert. Check mein Kommentar hier für eine vollständige Selektor zu beheben asp.net Steuerung: codeproject.com/Tips/269388/... Stellen Sie sicher, Sie nennen es nach dem einfügen alles in den dom, wenn mit Ajax.
Dieser post gerade meinen Tag gerettet...Wow..Danke Jungs keyup Tat es.

InformationsquelleAutor cloakedninjas
28

Könnte man-dispatching events wie
```
el.dispatchEvent(new Event('focus'));
el.dispatchEvent(new KeyboardEvent('keypress',{'key':'a'}));
```
oder el.dispatchEvent(new Event('keypress', {keyCode: 'a'}))
new Event('keydown') funktioniert nicht auf IE
warum nicht KeyboardEvent? Es wählt zum automatischen füllen von Werten wie shiftKey und es ist der richtige Weg. Auch, setzen Sie eine Zeichenfolge in Schlüsselcode, das ist falsch.
Wenn Sie brauchen Ctrl: el.dispatchEvent(new KeyboardEvent('keydown', { keyCode: 70, ctrlKey: true })); (Dadurch wird eine Verknüpfung Ctrl + F)

InformationsquelleAutor aljgom

Hier ist eine vanilla-js-Beispiel zu trigger Veranstaltung:

function triggerEvent(el, type){
if ('createEvent' in document) {
        //modern browsers, IE9+
        var e = document.createEvent('HTMLEvents');
        e.initEvent(type, false, true);
        el.dispatchEvent(e);
    } else {
        //IE 8
        var e = document.createEventObject();
        e.eventType = type;
        el.fireEvent('on'+e.eventType, e);
    }
}

Können Sie liefern ein paar Beispiele? Wie würden Sie Ihre Funktion verwendet werden, um zu senden Sie einen Gutscheincode?
Der Quellcode für diesen Beitrag finden Sie unter folgendem link die Dokumentation umfasst: plainjs.com/javascript/events/trigger-an-event-11

InformationsquelleAutor Sionnach733

10

Du bist jetzt in der Lage, das zu tun:
```
var e = $.Event("keydown", {keyCode: 64});
```
InformationsquelleAutor simonzack

Zunächst muss ich sagen, dass Probe aus Sionnach733 funktionierte einwandfrei. Einige Benutzer beschweren sich über fehlenden Beispiele. Hier ist meine zwei Cent. Ich habe mit der Maus klicken Sie auf simulation, wenn Sie diese Website: https://www.youtube.com/tv. Sie können öffnen Sie eine beliebige video-und versuchen Sie diesen code ausführen. Es führt wechseln zum nächsten video.

function triggerEvent(el, type, keyCode) {
    if ('createEvent' in document) {
            //modern browsers, IE9+
            var e = document.createEvent('HTMLEvents');
            e.keyCode = keyCode;
            e.initEvent(type, false, true);
            el.dispatchEvent(e);
    } else {
        //IE 8
        var e = document.createEventObject();
        e.keyCode = keyCode;
        e.eventType = type;
        el.fireEvent('on'+e.eventType, e);
    }
}

var nextButton = document.getElementsByClassName('icon-player-next')[0];
triggerEvent(nextButton, 'keyup', 13); //simulate mouse/enter key press

InformationsquelleAutor yuliskov

0

Ich dachte, ich würde Ihre Aufmerksamkeit, dass in dem spezifischen Kontext, in dem ein listener definiert wurde (in ein jQuery-plugin, dann das einzige, was erfolgreich simuliert das keypress-Ereignis für mich, schließlich gefangen Zuhörer, war der Einsatz von setTimeout().
z.B.
```
setTimeout(function() { $("#txtName").keypress() } , 1000);
```
Jegliche Nutzung $("#txtName").keypress() war ignoriert, obwohl am Ende der .ready() function. Keine besonderen DOM-supplement wurde erstellt asynchron sowieso.

InformationsquelleAutor Fabien Haddadi

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.