want to make an action listener in javascript

F

finerrecliner

i'm trying to make an action listener that will display an alert box
when the user clicks anywhere on the page once, and then go back to
normal mouse behavior.

i have this:
<html><script type="text/javascript">
document.addEventListener('click',hello(),false);
function hello()
{
alert("hello world!")
}
</script></html>

but all it does is show the alert box upon the page loading, and does
nothing when i click.

i only care about it working in firefox 1.5+

thanks for the help.
 
J

Jeremy

i'm trying to make an action listener that will display an alert box
when the user clicks anywhere on the page once, and then go back to
normal mouse behavior.

i have this:
<html><script type="text/javascript">
document.addEventListener('click',hello(),false);
function hello()
{
alert("hello world!")
}
</script></html>

but all it does is show the alert box upon the page loading, and does
nothing when i click.

i only care about it working in firefox 1.5+

thanks for the help.
Click to expand...

This is because your call to addEventListener should look like this:

document.addEventListener('click',hello,false);

If you include the parentheses ("hello()"), the function is called
before passing to addEventListener (which is why the alert box comes up
when the page loads). You want to pass the function itself to
addEventListener, not the results of the function.

Jeremy
 
B

bobzimuta

i'm trying to make an action listener that will display an alert box
when the user clicks anywhere on the page once, and then go back to
normal mouse behavior.

i have this:
<html><script type="text/javascript">
document.addEventListener('click',hello(),false);
Click to expand...

Don't forget to include cross-browserness:

if( document.addEventListener )
document.addEventListener( 'click', hello, false );
else if( document.attachEvent )
document.attachEvent( 'onclick', hello );
else
document.onclick = hello;

Turn this into a function, create the opposite function to remove
events and you're set.
 
R

Randy Webb

bobzimuta said the following on 8/14/2006 8:32 PM:
Don't forget to include cross-browserness:

if( document.addEventListener )
document.addEventListener( 'click', hello, false );
else if( document.attachEvent )
document.attachEvent( 'onclick', hello );
else
document.onclick = hello;

Turn this into a function, create the opposite function to remove
events and you're set.
Click to expand...

Why make things more difficult than they are?

document.onclick=hello;

Unless someone knows of a browser where that doesn't work, that is less
than 8 years old, then there is no need for anything else.
 
M

Matt Kruse

Randy said:
Why make things more difficult than they are?
document.onclick=hello;
Unless someone knows of a browser where that doesn't work, that is
less than 8 years old, then there is no need for anything else.
Click to expand...

Unless you have two scripts (or might in the future) which both want to
attach to the onclick event. Then the above would have one overwrite the
other. Not good.
 
R

Richard Cornford

Matt said:
Unless you have two scripts (or might in the future) which both
want to attach to the onclick event. Then the above would have
one overwrite the other. Not good.
Click to expand...

As the presented script had a final - x.onclick = y; - branch it would
be dangerous to use it to add multiple handlers anyway as any browser
taking that branch would experience problems. And it could be argued to
be a worse situation as number of browsers taking that final branch
would be small, and no example may be included in the test browsers
used, resulting in the impression that there were no problems following
from using that function on the same element repeatedly. At least
Randy's proposal produces code that will exhibit the same behaviour in
all environments, so an issue with multiple handlers will be evident
from the moment the second handler is introduced.

Richard.
 
S

Stephen Chalmers

Randy said:
Why make things more difficult than they are?

document.onclick=hello;
Click to expand...
That doesn't address the requirement that it should be called only
once.

document.onclick=function(){ alert('Your first click!');
document.onclick=null; }
 
R

Randy Webb

Stephen Chalmers said the following on 8/15/2006 8:44 AM:
That doesn't address the requirement that it should be called only
once.

document.onclick=function(){ alert('Your first click!');
document.onclick=null; }
Click to expand...

Very true, but, I wasn't addressing that part of the code. I was
addressing the efficiency of the code. And yes, I am aware of the
multiple event handlers issue mentioned by Matt.
 
B

bobzimuta

Randy said:
Why make things more difficult than they are?

document.onclick=hello;

Unless someone knows of a browser where that doesn't work, that is less
than 8 years old, then there is no need for anything else.
Click to expand...

What's so difficult with

function hello()
{
alert( 'hello' );
removeEvent( document, 'click', hello, false );
}

addEvent( document, 'click', hello, false );

It's clean and follows the DOM 2 spec.
 
R

Randy Webb

bobzimuta said the following on 8/15/2006 2:52 PM:
What's so difficult with

function hello()
{
alert( 'hello' );
removeEvent( document, 'click', hello, false );
}

addEvent( document, 'click', hello, false );

It's clean and follows the DOM 2 spec.
Click to expand...

Nothing - if and only if - it is supported.

Did you test that code in any browsers?
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Similar Threads

How can I hide a div using an event listener on multiple checkboxes? 6
I want to Display Excel As HTML In js 2
How to make an input box enable for only past dates and for the startdate if it falls in the current month? 5
Canvas drawing HTML Javascript on elementor 1
event listener (how to) 2
Sticky Header - How Do I Make It Hide/Show on Scroll? 0
Add recipes using JavaScript in table 20
Javascript scroll to sections and also scroll to section but open relevant nav-tab 4

Members online

Total: 28 (members: 3, guests: 25)
Robots: 187

Forum statistics

Threads
473,756
Messages
2,569,533
Members
45,007
Latest member
OrderFitnessKetoCapsules

Latest Threads

Top