jQuery event.namespace Property

Beginner
6 min read
Updated: Oct 2026
5 examples
Live preview
jQuery event.namespace property — read the namespace from namespaced .on() and .trigger() calls
Definition

What Is event.namespace?

event.namespace is a String on the jQuery event object. It holds the namespace from a namespaced bind or trigger (for example click.myPlugin → "myPlugin"). Added in jQuery 1.4.3. Mostly used by plugin authors to behave differently per namespace.

Remember
event.namespace   // String — read-only

.on("click.myPlugin", fn)  → namespace = "myPlugin"
.on("test.something", fn)  → namespace = "something"
.on("click", fn)           → namespace = ""

event.type       → base name ("click", "test")
.off(".myPlugin") → remove all handlers in that namespace
NeedUse
Read namespaceevent.namespace
Read base typeevent.type
Bind with namespace.on("type.name", fn)
Remove by namespace.off(".name")
Fire namespaced.trigger("type.name")
Approach

How to Use event.namespace

Bind with a dotted name, then read the suffix inside the handler.

  1. Pick a short namespace for your plugin or feature (for example myPlugin).
  2. Bind with .on("click.myPlugin", handler) (or any event type).
  3. Inside the handler, read event.namespace — and event.type for the base name.
  4. To tear down plugin listeners only, call .off(".myPlugin").
  5. To fire a namespaced custom event, use .trigger("test.something").
PieceRequired?Role
Bind / trigger stringYestype or type.namespace
event.namespace—Suffix after the first dot (or "")
event.type—Base event name only
.off(".namespace")OptionalRemove all handlers in that namespace

Pseudocode

Pseudocode
bindString = "type.namespace"   // or just "type"

element.on(bindString, handler)

when event fires:
    event.type      = "type"
    event.namespace = "namespace"   // or "" if none
    call handler(event)

// Plugin cleanup:
element.off(".namespace")   // drops every handler with that suffix
Reference

Cheat Sheet

Keep these facts handy while wiring namespaced handlers.

TopicDetail
TypeString property (not a method)
SincejQuery 1.4.3
Official demotest.something → "something"
No namespaceEmpty string ""
Multi-segmentclick.foo.bar → "foo.bar"
vs event.typeType = base; namespace = suffix
Cleanup.off(".myPlugin")
Mutates?No — read-only; set by jQuery
Try it

Live Preview

Trigger namespaced custom events and see event.type + event.namespace — same idea as the official jQuery API demo.

Bound with namespaced .on() — Fire event to read event.namespace.

Result
Waiting — pick a trigger and click Fire event.
Code

jQuery Examples

Short, copy-ready snippets. Open DevTools, or use Try It Yourself for a live editor.

Example 1 — Official Demo: Read the Namespace

Bind test.something, trigger it from a button, show event.namespace.

jQuery
$("#target").on("test.something", function (event) {
  $("#out").text('event.namespace = "' + event.namespace + '"');
});

$("#fire").on("click", function () {
  $("#target").trigger("test.something");
});
Try It Yourself

How It Works

  1. Bind. test.something splits into type test and namespace something.
  2. Trigger. The button calls .trigger("test.something") on #target.
  3. Read. The handler logs event.namespace — not the full bind string.
  4. Result. Output is "something".

Example 2 — Plugin Pattern: click.myPlugin

Namespaced and plain click can share one element; namespaces stay separate.

jQuery
var lines = [];

$("#btn").on("click.myPlugin", function (event) {
  lines.push(
    "plugin: type=" + event.type +
    ", namespace=\"" + event.namespace + "\""
  );
});

$("#btn").on("click", function (event) {
  lines.push(
    "app: type=" + event.type +
    ", namespace=\"" + event.namespace + "\""
  );
  $("#out").text(lines.join("\n"));
  lines = [];
});
Try It Yourself

How It Works

  1. Plugin bind. click.myPlugin sets event.namespace to "myPlugin".
  2. App bind. Plain click sets event.namespace to "".
  3. One click. Both handlers run; each sees its own namespace.
  4. Why it helps. Plugins and page code coexist without clobbering each other.

Example 3 — Clean Up with .off(".myPlugin")

Init plugin handlers, then remove only that namespace.

jQuery
function onPlugin(event) {
  $("#out").text(event.type + " — " + event.namespace);
}

$("#init").on("click", function () {
  $("#box")
    .off(".myPlugin")
    .on("click.myPlugin mouseenter.myPlugin", onPlugin);
  $("#out").text("Plugin ready — click or hover the box.");
});

$("#destroy").on("click", function () {
  $("#box").off(".myPlugin");
  $("#out").text("Destroyed — .off('.myPlugin') removed handlers.");
});
Try It Yourself

How It Works

  1. Init. Bind click and mouseenter under .myPlugin.
  2. Interact. Handlers report event.type and event.namespace.
  3. Destroy. .off(".myPlugin") drops every handler in that namespace.
  4. Safe. Other non-namespaced listeners on the same element stay intact.

Example 4 — Branch on event.namespace

One handler for notify.success and notify.error.

jQuery
$(document).on("notify.success notify.error", function (event) {
  if (event.namespace === "success") {
    $("#out").text("Saved! (namespace: " + event.namespace + ")");
  } else if (event.namespace === "error") {
    $("#out").text("Failed. (namespace: " + event.namespace + ")");
  }
});

$("#ok").on("click", function () {
  $(document).trigger("notify.success");
});
$("#bad").on("click", function () {
  $(document).trigger("notify.error");
});
Try It Yourself

How It Works

  1. One listener. Both notify.success and notify.error share a handler.
  2. Type stays same. event.type is "notify" for both.
  3. Branch. Compare event.namespace to "success" or "error".
  4. Trigger. Buttons fire the matching namespaced custom event.

Example 5 — Custom Widget Lifecycle Events

Trigger widget.refresh / widget.destroy and read the namespace.

jQuery
$("#widget").on("widget.refresh widget.destroy", function (event) {
  $("#out").text(
    "widget." + event.namespace +
    " fired (type: " + event.type + ")"
  );
});

$("#refresh").on("click", function () {
  $("#widget").trigger("widget.refresh");
});
$("#destroy").on("click", function () {
  $("#widget").trigger("widget.destroy");
});
Try It Yourself

How It Works

  1. Custom type. widget is not a DOM event — jQuery still supports it.
  2. Suffix. refresh / destroy land in event.namespace.
  3. Trigger. Buttons call .trigger("widget.refresh") or .trigger("widget.destroy").
  4. Message. The handler rebuilds the full name from type + namespace.

Edge Cases & Pitfalls

Watch for these when using namespaced events.

empty

No namespace → "", not undefined

Plain binds leave event.namespace as an empty string. Prefer if (event.namespace) or an exact string compare.

split

Do not confuse type and namespace

For click.myPlugin, event.type is "click" and event.namespace is "myPlugin". Neither property holds the full "click.myPlugin" string.

off

.off("click") vs .off(".myPlugin")

.off("click") removes all click handlers. .off(".myPlugin") removes every event type under that namespace — safer for plugin teardown.

readonly

You cannot assign event.namespace

jQuery sets it from the bind/trigger string. To control it, bind or trigger with the dotted name you want.

Compatibility

Browser Support

event.namespace is a jQuery event-object property (since 1.4.3). It works in every browser where your loaded jQuery version runs — namespaces are a jQuery feature, not a native DOM API.

✓ Stable · jQuery 1.4.3+

event.namespace

Supported wherever jQuery 1.4.3+ is loaded. Prefer jQuery 3.x with .on() / .off() / .trigger() for modern namespaced event code.

100% jQuery support
Google Chrome All versions · Desktop & Mobile
Full support
Mozilla Firefox All versions · Desktop & Mobile
Full support
Apple Safari All versions · macOS & iOS
Full support
Microsoft Edge All versions · Chromium & Legacy
Full support
Internet Explorer IE 6+ · Legacy environments
Full support
Opera All modern versions
Full support
event.namespace 1.4.3+

Bottom line: Safe for production plugins. Use dotted binds for isolation, .off(".namespace") for cleanup, and event.namespace to branch in shared handlers.

Analysis

Performance Notes

ApproachCostBest for
.on("click.ns", fn)CheapIsolating plugin handlers
.off(".ns")CheapPlugin destroy / teardown
Branch on event.namespaceCheapShared custom-event handlers
Many unique namespacesSlightly more bookkeepingKeep names short and consistent

Namespaces add almost no runtime cost. The win is cleaner teardown and safer coexistence — not micro-optimizing string splits.

Remember

Key Takeaways

  • Role: read the namespace suffix from a namespaced event.
  • Pair: event.type = base name; event.namespace = suffix.
  • Cleanup: .off(".myPlugin") removes only that namespace.
  • Empty: no namespace → "", not undefined.

One line: bind with type.namespace, read event.namespace, tear down with .off(".namespace").

Frequently Asked Questions

event.namespace is a String on the jQuery event object. It holds the namespace from a namespaced bind or trigger — for example .on("click.myPlugin", fn) sets event.namespace to "myPlugin" when that handler runs. Available since jQuery 1.4.3.
Append a dot and name after the event type: .on("click.myPlugin", handler) or .on("test.something", handler). The part after the first dot is stored in event.namespace (extra segments stay as "foo.bar").
event.type is the base name — "click", "test", "keydown". event.namespace is only the suffix — "myPlugin", "something", or "" when the binding that fired had no namespace.
Namespaces keep plugin handlers separate from app code, let you remove them with .off(".myPlugin"), and let shared handlers branch with event.namespace — especially for custom events.
event.namespace is an empty string "" — not undefined. Check with if (event.namespace) or compare to a name like event.namespace === "myPlugin".
No. It is read-only — jQuery sets it from the namespaced bind or trigger that ran the handler. Control it with distinct bind names or .trigger("type.namespace").

Next: event.type

Read the base event name — click, keydown, or your custom trigger string.

event.type tutorial →

About the author

Mari Selvan M P
Mari Selvan M P 🔗

Developer, cloud engineer, and technical writer

  • Experience 12 years building web and cloud systems
  • Focus Full Stack Development, AWS, and Developer Education

I write practical tutorials so students and working developers can learn by doing—from databases and APIs to deployment on AWS.

AWS Certified Developer – Associate (Credly)

9 people found this page helpful

jQuery event.which jQuery event.type Property