Definitive Way to Trigger Keypress Events With Jquery

Definitive way to trigger keypress events with jQuery

If you want to trigger the keypress or keydown event then all you have to do is:

var e = jQuery.Event("keydown");
e.which = 50; // # Some key code value
$("input").trigger(e);

Trigger a keypress/keydown/keyup event in JS/jQuery?

You can trigger any of the events with a direct call to them, like this:

$(function() {
    $('item').keydown();
    $('item').keypress();
    $('item').keyup();
    $('item').blur();
});

Does that do what you're trying to do?

You should probably also trigger .focus() and potentially .change()

If you want to trigger the key-events with specific keys, you can do so like this:

$(function() {
    var e = $.Event('keypress');
    e.which = 65; // Character 'A'
    $('item').trigger(e);
});

There is some interesting discussion of the keypress events here: jQuery Event Keypress: Which key was pressed?, specifically regarding cross-browser compatability with the .which property.

jQuery automatically trigger keypress events on page load

A possible approach is described in jQuery Event object documentation:

var e = jQuery.Event( "keypress", { shiftKey: true, keyCode: 82 } );

$(document).on('keypress', function(event) {

    if (event.shiftKey && event.keyCode == 82) {

        console.log("Shift R pressed...");

    }

});

//

//  press SHIFT + R

//

$(document).trigger(e);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Trigger Keypress with jQuery

Using trigger you are just triggering the event with a keycode but not assigning the value to the textbox. Try this :- http://jsfiddle.net/PbHD2/

String.fromCharCode

$("button").click(function() {
     $("input").focus();
    var e = jQuery.Event("keydown");
    e.which = 77; // # Some key code value
    $("input").val(String.fromCharCode(e.which));
    $("input").trigger(e);
});
$('input').keydown(function(e){
   console.log('Yes keydown triggered. ' + e.which)
});

Trigger keypress(keydown) with jQuery

$("#example").click(function() {    
    $("#search").focus();
    var e = jQuery.Event("keydown");
    e.keyCode = 50;                     
    $("#search").trigger(e);                    
});

ref: Definitive way to trigger keypress events with jQuery

Trigger keypress event with jQuery on a hidden input

Disabled elements don't fire mouse events. Most browsers will propagate an event originating from the disabled element up the DOM tree, so event handlers could be placed on container elements. However, Firefox doesn't exhibit this behavior, it just does nothing at all when you click on a disabled element.

As showed here, I suggest you to create a trigger element that when clicked show/enable the input temporary, launch a focus/click event as the post you suggested and then hide it again.

jQuery keypress event trigger not working on page load

As mentioned in the comment, just change the order and change keycode to keyCode as below.

Note: Please note the upper case in Code instead of lower case in code

$('#test').keypress(function(e) {

  alert(e.keyCode);

});

$('#test').trigger(jQuery.Event('keypress', { keyCode: 13 }));    

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input id="test" type="text" />

Way to trigger multiple keypress and hold events in jQuery

With the modifier keys alt, ctrl, and shift, you can use event modifiers specifically for them:

$(".f1").click(function() {
    var e = jQuery.Event("keydown");
    e.which = 112;       // # F1 code value
    e.altKey = true;     // Alt key pressed
    $("input").trigger(e);
});

Demo: http://jsfiddle.net/jtbowden/2kcrg/

---

Related Topics