473,287 Members | 1,663 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,287 software developers and data experts.

Event Handler Question

I have this even handler (using prototype.js):

showCommentsLinks[i].observe('click', function(event)
{ alert('hi') });
It's attaching to a link element:

<a id="showCommentsLink" href="comments/">Show Comments</a>

When ever my event handler is called, which can be implied as
javascript is enabled and working, I want to prevent the the browser
from following the href url.

If i wasn't using unobtrusive javascript, I would go like this:

<a id="showCommentsLink" href="comments/" onclick="alert('hi');return
false;">Show Comments</a>'

and that would prevent the browser from going to /comments after the
JS executes. How can I recreate this functionality with the
unobtrusive event handler above?

Apr 11 '07 #1
4 2109
On Apr 12, 9:01 am, "egg...@gmail.com" <egg...@gmail.comwrote:
I have this even handler (using prototype.js):

showCommentsLinks[i].observe('click', function(event)
{ alert('hi') });

It's attaching to a link element:

<a id="showCommentsLink" href="comments/">Show Comments</a>
Just because you are using Prototype does not mean you *must* use
Event.observe. In fact, you are better to only use it where its use
is specifically indicated (which is not very often).

Just have the function return false:

<script type="text/javascript">

function hi(){
alert('hi');
return false;
}

window.onload = function(){
document.getElementById('a00').onclick = hi;
}

</script>

<a href="http://..." id="a00">some link</a>
Or if your function doesn't return false, use:

window.onload = function(){
document.getElementById('a00').onclick = function(){
hi();
return false;
}
}

>
When ever my event handler is called, which can be implied as
javascript is enabled and working, I want to prevent the the browser
from following the href url.

If i wasn't using unobtrusive javascript, I would go like this:

<a id="showCommentsLink" href="comments/" onclick="alert('hi');return
false;">Show Comments</a>'
Most of what is included under the misnomer of 'unobtrusive
javascript' is ill-conceived - unobtrusive to whom? Can you provide a
definition?

Consider the example above. If a user clicks the link before the page
finishes loading, they will navigate to the link because your onload
handler hasn't added the A element's onclick handler yet. But if
you'd added it in-line, it would be there doing its job - which is
less obtrusive?

Maybe that's the effect you want, but the different behaviours may
surprise users.

and that would prevent the browser from going to /comments after the
JS executes.
Only if the page has finished loading and the handler has done its
job.
--
Rob

Apr 12 '07 #2
On Apr 11, 7:10 pm, "RobG" <r...@iinet.net.auwrote:
On Apr 12, 9:01 am, "egg...@gmail.com" <egg...@gmail.comwrote:
I have this even handler (using prototype.js):
showCommentsLinks[i].observe('click', function(event)
{ alert('hi') });
It's attaching to a link element:
<a id="showCommentsLink" href="comments/">Show Comments</a>

Just because you are using Prototype does not mean you *must* use
Event.observe. In fact, you are better to only use it where its use
is specifically indicated (which is not very often).

Just have the function return false:

<script type="text/javascript">

function hi(){
alert('hi');
return false;
}

window.onload = function(){
document.getElementById('a00').onclick = hi;
}

</script>

<a href="http://..." id="a00">some link</a>

Or if your function doesn't return false, use:

window.onload = function(){
document.getElementById('a00').onclick = function(){
hi();
return false;
}
}
When ever my event handler is called, which can be implied as
javascript is enabled and working, I want to prevent the the browser
from following the href url.
If i wasn't using unobtrusive javascript, I would go like this:
<a id="showCommentsLink" href="comments/" onclick="alert('hi');return
false;">Show Comments</a>'

Most of what is included under the misnomer of 'unobtrusive
javascript' is ill-conceived - unobtrusive to whom? Can you provide a
definition?

Consider the example above. If a user clicks the link before the page
finishes loading, they will navigate to the link because your onload
handler hasn't added the A element's onclick handler yet. But if
you'd added it in-line, it would be there doing its job - which is
less obtrusive?

Maybe that's the effect you want, but the different behaviours may
surprise users.
and that would prevent the browser from going to /comments after the
JS executes.

Only if the page has finished loading and the handler has done its
job.

--
Rob
If I set up the event handler by means of:

document.getElementById('a00').onclick = function(){

If any other code attaches tot he onclick the previous code will not
execute.

Apr 12 '07 #3
On Apr 12, 3:03 pm, "egg...@gmail.com" <egg...@gmail.comwrote:
On Apr 11, 7:10 pm, "RobG" <r...@iinet.net.auwrote:
On Apr 12, 9:01 am, "egg...@gmail.com" <egg...@gmail.comwrote:
I have this even handler (using prototype.js):
showCommentsLinks[i].observe('click', function(event)
{ alert('hi') });
It's attaching to a link element:
<a id="showCommentsLink" href="comments/">Show Comments</a>
Just because you are using Prototype does not mean you *must* use
Event.observe. In fact, you are better to only use it where its use
is specifically indicated (which is not very often).
Just have the function return false:
<script type="text/javascript">
function hi(){
alert('hi');
return false;
}
window.onload = function(){
document.getElementById('a00').onclick = hi;
}
</script>
<a href="http://..." id="a00">some link</a>
Or if your function doesn't return false, use:
window.onload = function(){
document.getElementById('a00').onclick = function(){
hi();
return false;
}
}
When ever my event handler is called, which can be implied as
javascript is enabled and working, I want to prevent the the browser
from following the href url.
If i wasn't using unobtrusive javascript, I would go like this:
<a id="showCommentsLink" href="comments/" onclick="alert('hi');return
false;">Show Comments</a>'
Most of what is included under the misnomer of 'unobtrusive
javascript' is ill-conceived - unobtrusive to whom? Can you provide a
definition?
Consider the example above. If a user clicks the link before the page
finishes loading, they will navigate to the link because your onload
handler hasn't added the A element's onclick handler yet. But if
you'd added it in-line, it would be there doing its job - which is
less obtrusive?
Maybe that's the effect you want, but the different behaviours may
surprise users.
and that would prevent the browser from going to /comments after the
JS executes.
Only if the page has finished loading and the handler has done its
job.
--
Rob

If I set up the event handler by means of:

document.getElementById('a00').onclick = function(){

If any other code attaches tot he onclick the previous code will not
execute.
That is an old excuse that doesn't stand up to scrutiny.

In what environment can you safely add as many handlers as you like to
an element, in no particular order, without regard for other handlers
that might already be there? In this specific case you want to stop
propagation - how do you know it's safe to do that if you don't know
what other handlers are there and whether they want the event to
propagate? How do you know the order in which they will be called?

You can only safely add multiple handlers if you know exactly what
each one will do and that order is unimportant. Otherwise, you are
much safer to add one handler that calls all the others as functions
in a known order and context.

In a very few cases you might want to add multiple handlers using
attachEvent and addEventListener, but imagine that is the exception
rather than the rule.

The above does not address the other issues of trying to make
addEventListener and attachEvent behave consistently in different
browsers.
--
Rob

Apr 12 '07 #4
On Apr 12, 12:38 am, "RobG" <r...@iinet.net.auwrote:
On Apr 12, 3:03 pm, "egg...@gmail.com" <egg...@gmail.comwrote:
On Apr 11, 7:10 pm, "RobG" <r...@iinet.net.auwrote:
On Apr 12, 9:01 am, "egg...@gmail.com" <egg...@gmail.comwrote:
I have this even handler (using prototype.js):
showCommentsLinks[i].observe('click', function(event)
{ alert('hi') });
It's attaching to a link element:
<a id="showCommentsLink" href="comments/">Show Comments</a>
Just because you are using Prototype does not mean you *must* use
Event.observe. In fact, you are better to only use it where its use
is specifically indicated (which is not very often).
Just have the function return false:
<script type="text/javascript">
function hi(){
alert('hi');
return false;
}
window.onload = function(){
document.getElementById('a00').onclick = hi;
}
</script>
<a href="http://..." id="a00">some link</a>
Or if your function doesn't return false, use:
window.onload = function(){
document.getElementById('a00').onclick = function(){
hi();
return false;
}
}
When ever my event handler is called, which can be implied as
javascript is enabled and working, I want to prevent the the browser
from following the href url.
If i wasn't using unobtrusive javascript, I would go like this:
<a id="showCommentsLink" href="comments/" onclick="alert('hi');return
false;">Show Comments</a>'
Most of what is included under the misnomer of 'unobtrusive
javascript' is ill-conceived - unobtrusive to whom? Can you provide a
definition?
Consider the example above. If a user clicks the link before the page
finishes loading, they will navigate to the link because your onload
handler hasn't added the A element's onclick handler yet. But if
you'd added it in-line, it would be there doing its job - which is
less obtrusive?
Maybe that's the effect you want, but the different behaviours may
surprise users.
and that would prevent the browser from going to /comments after the
JS executes.
Only if the page has finished loading and the handler has done its
job.
--
Rob
If I set up the event handler by means of:
document.getElementById('a00').onclick = function(){
If any other code attaches tot he onclick the previous code will not
execute.

That is an old excuse that doesn't stand up to scrutiny.

In what environment can you safely add as many handlers as you like to
an element, in no particular order, without regard for other handlers
that might already be there? In this specific case you want to stop
propagation - how do you know it's safe to do that if you don't know
what other handlers are there and whether they want the event to
propagate? How do you know the order in which they will be called?

You can only safely add multiple handlers if you know exactly what
each one will do and that order is unimportant. Otherwise, you are
much safer to add one handler that calls all the others as functions
in a known order and context.

In a very few cases you might want to add multiple handlers using
attachEvent and addEventListener, but imagine that is the exception
rather than the rule.

The above does not address the other issues of trying to make
addEventListener and attachEvent behave consistently in different
browsers.

--
Rob
Here's an example that's handy:

I was using messing around with a validation framework called xf.js
and it was attaching the onsubmit of my form in the way you describe.
However, since it doing it like that it was overwriting any event
handlers I attached to the onsubmit.

Apr 12 '07 #5

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

7
by: Pavils Jurjans | last post by:
Hallo, I have been programming for restricted environments where Internet Explorer is a standard, so I haven't stumbled upon this problem until now, when I need to write a DOM-compatible code. ...
18
by: Christopher W. Douglas | last post by:
I am writing a VB.NET application in Visual Studio 2003. I have written a method that handles several events, such as closing a form and changing the visible status of a form. I have some code...
2
by: Dominic | last post by:
Hi guys, I'm not sure if this question belongs to FAQ, but I couldn't find a concrete answer. I created a Datagrid control using ItemTemplate, but it's NOT a in-place editing datagrid. One of...
3
by: R Millman | last post by:
under ASP.NET, single stepping in debug mode appears not to stop within event procedures. i.e. 1) Create web page with submit button and event procedure for the click event in the code behind...
13
by: Charles Law | last post by:
Mr "yEaH rIgHt" posted the following link about a week ago in answer to my question about removing event handlers. > http://www.vbinfozine.com/t_bindevt.shtml Following on from that post, the...
6
by: Joseph Geretz | last post by:
I'm porting a C# Outlook Addin originally engineered as a COM Addin over to use VSTO. I've gotten this to the point where my VSTO Addin installs its Menu items and Toolbar buttons when Outlook...
1
by: tdan | last post by:
I do not know how to get Event.stopObserving() to work in the context I am using it. I am displaying a Color Selection Table and attaching 2 events: 1. onmouseover to display the color to the user...
2
by: wolverine | last post by:
Hi, I am writing a javascript code that parses dom and finds event handlers attached to mouseover events. Then i will replace the existing handler say B() with my own function say A(). When the...
24
by: =?Utf-8?B?U3dhcHB5?= | last post by:
Can anyone suggest me to pass more parameters other than two parameter for events like the following? Event: Onbutton_click(object sender, EventArgs e)" Event handler: button.Click += new...
4
by: tshad | last post by:
I am just getting started with events and had a couple of questions on why they do what they do. If you have a textbox and you want to handle an event you can just do: ...
2
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 7 Feb 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:30 (7.30PM). In this month's session, the creator of the excellent VBE...
0
by: DolphinDB | last post by:
The formulas of 101 quantitative trading alphas used by WorldQuant were presented in the paper 101 Formulaic Alphas. However, some formulas are complex, leading to challenges in calculation. Take...
0
by: DolphinDB | last post by:
Tired of spending countless mintues downsampling your data? Look no further! In this article, you’ll learn how to efficiently downsample 6.48 billion high-frequency records to 61 million...
0
by: Aftab Ahmad | last post by:
Hello Experts! I have written a code in MS Access for a cmd called "WhatsApp Message" to open WhatsApp using that very code but the problem is that it gives a popup message everytime I clicked on...
0
by: ryjfgjl | last post by:
ExcelToDatabase: batch import excel into database automatically...
0
by: marcoviolo | last post by:
Dear all, I would like to implement on my worksheet an vlookup dynamic , that consider a change of pivot excel via win32com, from an external excel (without open it) and save the new file into a...
1
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
0
by: Vimpel783 | last post by:
Hello! Guys, I found this code on the Internet, but I need to modify it a little. It works well, the problem is this: Data is sent from only one cell, in this case B5, but it is necessary that data...
1
by: PapaRatzi | last post by:
Hello, I am teaching myself MS Access forms design and Visual Basic. I've created a table to capture a list of Top 30 singles and forms to capture new entries. The final step is a form (unbound)...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.