jQuery Target Event

Thursday, June 21, 2012

The jQuery event target provides information about which DOM element triggered the event.


Syntax

event.target


ParameterDescription
eventSpecifies the event to check.


Basic Example

In the following jQuery example, the target event's properties can be accessed to determine which HTML element is clicked in the document. Try it by clicking different elements in this page. The results will be displayed in the div element below.


<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
  $("p, h1, h2, div, table, tr, th, td").click(function (e) {
    $("#div1").html("Triggered by the e.target.nodeName ... ");
  });
});
</script>
</head>
<body>     
<div id="div1"></div>
</body>
</html>


Did you find the page informational and useful? Share it using one of your favorite social sites.

Recommended Books & Training Resources

JavaScript and jQuery: The Missing Manual Pro jQuery HTML CSS and JavaScript Editor