Home »
jQuery »
jQuery DOM Manipulation Methods
jQuery event.namespace Property
jQuery | event.namespace Property: Learn about the jQuery event.namespace Property with its usages, syntax, and examples.
Submitted by Pratishtha Saxena, on October 28, 2022
event.namespace Property
An event is an action occurred by the user. Therefore, many functions and methods can be set according to those actions performed. When these actions are defined for an event interface, we term those as the event properties. There are various predefined event properties in jQuery. Here, let's discuss the event.namespace Property.
The event.namespace is a built-in property in jQuery. This property helps us to get the namespace defined for the selector on a particular event.
There can be various event listeners for an element that get executed when the event is triggered. But when those event listeners have to be removed, then it somehow removes all the event handlers listed with that particular event. What if, we only need to remove a particular event handler? It would be easier if we could refer to them individually. Hence, providing some random name with the event helps to refer to the event listener specifically.
event.namespace Property Syntax
event.namespace
This property takes in one required parameter – event. This event parameter is the one specified in the binding function. The below example shows how the events are triggered when the sentences are clicked, and once the button is clicked, event.namespace gets fired and nothing further happens if the sentences are clicked again.
jQuery event.namespace Property Example
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<title>Document</title>
</head>
<body>
<h2>jQuery Event - Namespace Property</h2>
<p>Click the button to remove the Namespace from the sentences.</p>
<button>Remove</button>
<hr>
<p>Welcome to Include Help</p>
<p>This is jQuery tutorial for events.</p>
<p>Thanks for visiting</p>
<hr>
</body>
<script type="text/javascript">
$(document).ready(function(){
$("p").on("click.myFont", function(){
$(this).css('font-size','x-large');
});
$("button").click(function(){
$("p").off("click.myFont");
});
});
</script>
</html>
Output:
