Javascript DOM Event bubbles Property

Introduction

Find out if a specific event can bubble or not:

Click the button to find out if the onclick event is a bubbling event. 

var x = event.bubbles;

View in separate window 

<!DOCTYPE html>
<html>
<body>
<button onclick="myFunction(event)">Test</button>

<p id="demo"></p>

<script>
function myFunction(event) {/*from   w w  w. ja v  a2s  .c o m*/
  var x = event.bubbles;
  document.getElementById("demo").innerHTML = x;
}
</script>

</body>
</html>

The bubbles event property returns a Boolean value that indicates whether or not an event is a bubbling event.

Event bubbling directs an event to its intended target:

For example,

A button is clicked and the event is directed to the button.

If an event handler is set for that object, the event is triggered.

If no event handler is set for that object, the event bubbles up to the objects parent.

The event bubbles up from parent to parent until it is handled, or until it reaches the document object.

The bubbles event property possible values:

  • true - The event can bubble up through the DOM
  • false - The event does not bubble



PreviousNext

Related