Sets or retrieves whether the current event should bubble up the hierarchy of event handlers.
event.cancelBubble = false
false (default)
Bubbling is enabled, allowing the next event handler in the hierarchy to receive the event.
true
Bubbling is disabled for this event, preventing the next event handler in the hierarchy from receiving the event.
A typical example for this would be if you had a nested div where both the divs had an onclick event.
Click in Div1 and you will produce 1 alert, when you click in Div2 you will produce 2 alerts, one for each div.
<div onclick="alert('Div 1 was clicked')">Div 1
<div onclick="alert('Div 2 was clicked')">Div 2</div>
</div>
Applying event.cancelBubble=true to Div2 cancels the click event in Div1 when Div2 is clicked keeping both events seperate.
<div onclick="alert('Div 1 was clicked')">Div 1
<div onclick="event.cancelBubble=true; alert('Div 2 was clicked')">Div 2</div>
</div>