473,395 Members | 1,872 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,395 software developers and data experts.

How to add to existing onclick?

I would like to use code like the following:

this.onclick = function(e)
{
alert("I'm in the onclick handler");
}

But I do not want to wipe out any existing onclick event code. I want to do
this dynamically.

I tried variations like this:

var oc = this.onclick;
this.onclick = function(e)
{
alert("I'm in the onclick handler");
if (oc != null)
eval(oc.toString());
}

but can't get it to work.

Is this sort of thing possible? If so, how is it done?

TIA.
Jul 23 '05 #1
2 2055
Peter wrote:
I would like to use code like the following:

this.onclick = function(e)
{
alert("I'm in the onclick handler");
}

But I do not want to wipe out any existing onclick event code. I want to do this dynamically.

I tried variations like this:

var oc = this.onclick;
this.onclick = function(e)
{
alert("I'm in the onclick handler");
if (oc != null)
eval(oc.toString());
}

but can't get it to work.

Is this sort of thing possible? If so, how is it done?

TIA.


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<script type="text/javascript">

function addHandler(obj, evt, newhandler, captures)
{
if (obj.attachEvent)
obj.attachEvent('on' + evt, newhandler);
else if (obj.addEventListener)
obj.addEventListener(evt, newhandler, captures);
else
{
var oldhandler;
if (oldhandler = obj['on' + evt])
obj['on' + evt] = function()
{
oldhandler();
newhandler();
}
else obj['on' + evt] = newhandler;
}
}

function test()
{
alert('new handler...');
}

window.onload = function()
{
addHandler(document.getElementById('foo1'), 'click', test, false);
addHandler(document.getElementById('foo2'), 'click', test, false);
}

</script>
</head>
<body>
<button id="foo1">no old handler, new added onload</button>
<button id="foo2" onclick="alert('old handler...')">old handler, new
added onload</button>
</body>
</html>

Jul 23 '05 #2
Rob,

Thanks. That's an interesting example.

In my testing, I was missing the parens after the name of the variable I was
storing the old handler in.

Much appreciated,
Pete

RobB wrote:
Peter wrote:
I would like to use code like the following:

this.onclick = function(e)
{
alert("I'm in the onclick handler");
}

But I do not want to wipe out any existing onclick event code. I
want to do this dynamically.

I tried variations like this:

var oc = this.onclick;
this.onclick = function(e)
{
alert("I'm in the onclick handler");
if (oc != null)
eval(oc.toString());
}

but can't get it to work.

Is this sort of thing possible? If so, how is it done?

TIA.


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<script type="text/javascript">

function addHandler(obj, evt, newhandler, captures)
{
if (obj.attachEvent)
obj.attachEvent('on' + evt, newhandler);
else if (obj.addEventListener)
obj.addEventListener(evt, newhandler, captures);
else
{
var oldhandler;
if (oldhandler = obj['on' + evt])
obj['on' + evt] = function()
{
oldhandler();
newhandler();
}
else obj['on' + evt] = newhandler;
}
}

function test()
{
alert('new handler...');
}

window.onload = function()
{
addHandler(document.getElementById('foo1'), 'click', test, false);
addHandler(document.getElementById('foo2'), 'click', test, false);
}

</script>
</head>
<body>
<button id="foo1">no old handler, new added onload</button>
<button id="foo2" onclick="alert('old handler...')">old handler, new
added onload</button>
</body>
</html>

Jul 23 '05 #3

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

Similar topics

5
by: Carol Lyn | last post by:
Could use your assistance with this. I have a window that opens via onclick and it is a small window with info about a site. If the user is interested in visiting that site, there is a link to...
1
by: Edd Read | last post by:
Hi, I have made a basic WYSIWYG editor using the execCommand functions. I use an iFrame as the editing area and so far I have managed to create documents from a blank page and save them to a...
6
by: Fredrik Celin | last post by:
If I add an event (to a div for example) with js, it replaces the event if there already is one. How can I add instead of replace this? Example: <body onLoad="testDiv.onmouseover =...
2
by: C Elson | last post by:
I was wondering if anyone can help me out. I'm trying to use a script called Animated Window Opener II (http://www.dynamicdrive.com/dynamicindex8/animatedwin2.htm) from Dynamic Drive...
1
by: jp | last post by:
bigger image opens in new window within an existing javascript. I am working within a existing javascript. see www.art4companies.nl and press kunstenaars than press any name to see what I mean....
4
by: VA | last post by:
I am using a JS library of functions that I include in my web page using the usual <script type="text/javascript" src=...> method Is there a way to automatically call one of my own functions...
6
by: Stefan Mueller | last post by:
The following code (HTML) generates a table. Now I'd like to insert a new row by a javascript. The following code (javascript) works with the Internet Explorer and also with Mozilla. However, the...
7
by: Andrea | last post by:
Hi there - I'm hoping someone can help me; I've been struggling with this for a few days! :-) I have a webpage that is comprised of many forms containing questions. As the user answers one...
2
by: trullock | last post by:
Hi, Ive installed the ASP.NET AJAX extensions and ive set up a simple example, however its not doing anything asynchronously, its always posting back... Could this be something to do with the...
0
by: ryjfgjl | last post by:
If we have dozens or hundreds of excel to import into the database, if we use the excel import function provided by database editors such as navicat, it will be extremely tedious and time-consuming...
0
by: ryjfgjl | last post by:
In our work, we often receive Excel tables with data in the same format. If we want to analyze these data, it can be difficult to analyze them because the data is spread across multiple Excel files...
0
BarryA
by: BarryA | last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
0
by: Hystou | last post by:
There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...
0
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
0
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
0
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...
0
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...
0
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each...

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.