By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
459,222 Members | 1,436 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 459,222 IT Pros & Developers. It's quick & easy.

Question about event bubbling

P: n/a
I1. notice that if you have an onclick event for both the document
and for a particular element, the onclick for the element is called
first and then it bubbles up to the one for the document. Is it
possible to have an onclick event that is at the document level that
is called first? I would like to intercept it there and return false
so that it doesn't bubble down to the element level.

2. On a completely unrelated topic, is it possible to change the
cursor for a Select element (dropdown list)? I can change the cursor
for all my other controls except for that one.

Thanks in advance.
Jul 23 '05 #1
Share this Question
Share on Google+
1 Reply


P: n/a


john wrote:
I1. notice that if you have an onclick event for both the document
and for a particular element, the onclick for the element is called
first and then it bubbles up to the one for the document. Is it
possible to have an onclick event that is at the document level that
is called first? I would like to intercept it there and return false
so that it doesn't bubble down to the element level.
DOM Level 2 event compliant browsers like Mozilla, Netscape 6/7 or Opera
7 allow you to set up capturing event listeners that are called while an
event is propagated down the document tree and there you can stop the
propagation if needed:

<html lang="en">
<head>
<title>event capturing</title>
<script type="text/javascript">
function initEventListeners () {
if (document.addEventListener) {
document.addEventListener(
'click',
function (evt) {
var srcElement = evt.target;
while (srcElement.nodeType != 1) {
srcElement = srcElement.parentNode;
}
if (srcElement.id == 'p1') {
if (evt.stopPropagation) {
evt.stopPropagation();
}
}
},
true
);
}
}
initEventListeners();
</script>
</head>
<body>
<p id="p1"
onclick="alert(event.type + ' at ' + this.id);">
Kibology for all.
Click events shouldn't reach this paragraph.
</p>
<p id="p2"
onclick="alert(event.type + ' at ' + this.id);">
Kibology for all.
Click events should reach this paragraph.
</p>
</body>
</html>

However IE4/5/6 only supports event bubbling up the document tree so
there you can't use that approach.
2. On a completely unrelated topic, is it possible to change the
cursor for a Select element (dropdown list)? I can change the cursor
for all my other controls except for that one.


Try CSS, e.g.
<select style="cursor: pointer;"
some browsers might support that, IE probably not

--

Martin Honnen
http://JavaScript.FAQTs.com/

Jul 23 '05 #2

This discussion thread is closed

Replies have been disabled for this discussion.