jQuery .keypress() Method

What Is .keypress()?

.keypress() is jQuery’s legacy shorthand for the keypress event (since 1.0). Pass a handler to bind; call it with no arguments to trigger. Binding forms are deprecated since jQuery 3.3.

$("#el").keypress(fn)           // bind (deprecated)
$("#el").keypress(data, fn)     // bind + eventData (deprecated)
$("#el").keypress()             // trigger handlers

// Modern replacements:
$("#el").on("keypress", fn)
$("#el").trigger("keypress")

How to Use .keypress()

Recognize the shorthand in old code, then migrate to .on / .trigger.

1. Find .keypress(fn) or bare .keypress() in legacy scripts.
2. Rewrite binds as .on("keypress", fn) (add eventData as the middle arg if needed).
3. Rewrite triggers as .trigger("keypress").
4. Keep using event.which for character codes — that part does not change.

Pseudocode

if called with handler:
    // deprecated since 3.3
    bind handler to "keypress" on each element
    (same as .on("keypress", handler))

if called with (eventData, handler):
    bind with data → event.data
    (same as .on("keypress", eventData, handler))

if called with no arguments:
    fire "keypress" on each matched element
    (same as .trigger("keypress"))

Cheat Sheet

Legacy vs modern — keep this table for quick migrations.

Live Preview

Compare the deprecated shorthand with the modern API. Type in the field, or click Trigger to fire handlers.

$("#field").keypress(fn)  // deprecated bind
→ type a letter to fire

/* prefer .on("keypress", fn) */

jQuery Examples

Short demos of the legacy shorthand and how to migrate. Prefer .on / .trigger in new code.

$("#target").keypress(function () {
  console.log("Handler for keypress called.");
});

Focus #target, type a letter →
Handler for keypress called.

(Deprecated — prefer .on("keypress", fn))

$("#search").keypress({ fieldId: "search" }, function (event) {
  $("#out").text(
    "Field: " + event.data.fieldId + " | char: " + event.which
  );
});

Type "a" → Field: search | char: 97

Modern: .on("keypress", { fieldId: "search" }, fn)

var count = 0;

$("#target").keypress(function () {
  count++;
  $("#out").text("Fired " + count + " time(s)");
});

$("#fire").click(function () {
  $("#target").keypress();
});

Click #fire → .keypress() → Fired 1 time(s)

Prefer: $("#target").trigger("keypress")

// Legacy
$("#target").keypress(function () {
  console.log("legacy");
});
$("#target").keypress();

// Modern (prefer this)
$("#target").on("keypress", function () {
  console.log("modern");
});
$("#target").trigger("keypress");

Both styles bind and fire the same keypress event
→ console logs "legacy" then "modern" when triggered

Use only the modern form in new projects

Performance Notes

Migrating to .on does not change performance — it clarifies intent and unlocks delegation. Optimize the handler body, not the binding API.

Key Takeaways