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

change the onclick value of an <IMG> tag from javascript

KS
Just to show some code to show the consept.

<img id="date" onclick="javascript:show_calendar();"
src="/PlexSysWeb/images/show-calendar.gif" width=20 height=18 border=0>

What i want the javascript to do is change the onclick value of the <IMG>
tag above, by calling the test function from the same webpage by onclick on
a button.

<input type="button" onclick="test()"value="test"/>

<script language='JavaScript'>

function test(){

document.all.date.onclick = "alert('kalenderdato')";

}

</script>

The problem is when i first click the button, and then the <IMG> tag on the
same webpage, the script has not change it. I dont get the alert but the
original onclick value from the IMG.

KS
Jul 23 '05 #1
8 67423
Rearrange it as follows:

<html>
<head>
<script>
function show_calendar(){
alert('show calendar');
}

function rewriteOnclick(){
alert('test');
}

function test(){
document.getElementById("date").onclick = rewriteOnclick;
}
</script>
</head>

<body>
<img id="date" onClick="show_calendar();"
src="a.gif" width=200 height=100 border=0>
<form><input type="button" onclick="test()"value="test"/></form>
</body>
</html>

The basic idea is that you should not reassign to the event a string but a
function name.
I may perhaps also add that if you use document.all you may consider using
document.getElementById too, but I also guess that you already do and that
yours was just an example snippet.

Anyway try the above, it should work.
let us know
ciao
Alberto
http://www.unitedscripters.com/


"KS" <ka*****@hotmail.com> ha scritto nel messaggio
news:41********@news.broadpark.no...
Just to show some code to show the consept.

<img id="date" onclick="javascript:show_calendar();"
src="/PlexSysWeb/images/show-calendar.gif" width=20 height=18 border=0>

What i want the javascript to do is change the onclick value of the <IMG>
tag above, by calling the test function from the same webpage by onclick on a button.

<input type="button" onclick="test()"value="test"/>

<script language='JavaScript'>

function test(){

document.all.date.onclick = "alert('kalenderdato')";

}

</script>

The problem is when i first click the button, and then the <IMG> tag on the same webpage, the script has not change it. I dont get the alert but the
original onclick value from the IMG.

KS

Jul 23 '05 #2
KS wrote:
Just to show some code to show the consept.

<img id="date" onclick="javascript:show_calendar();"
src="/PlexSysWeb/images/show-calendar.gif" width=20 height=18 border=0>
<img name="date" onclick="show_calendar();" ...>

or

<img id="dateId" name="dateName" onclick="show_calendar();" ...>
What i want the javascript to do is change the onclick value of the <IMG>
tag above, by calling the test function from the same webpage by onclick on
a button.

<input type="button" onclick="test()"value="test"/>

<script language='JavaScript'>

function test(){

document.all.date.onclick = "alert('kalenderdato')";
document.images['date'].onclick = function () { alert('kalenderdato'); }

or

var img;
if (document.getElementById) {
img = document.getElementById('dateId');
} else if (document.all) {
img = document.all['dateId'];
} else if (document.images) {
img = document.images['dateName'];
}
if (img) {
img.onclick = function () { alert('kalenderdato'); }
}
}

</script>

The problem is when i first click the button, and then the <IMG> tag on the
same webpage, the script has not change it. I dont get the alert but the
original onclick value from the IMG.


--
Grant Wagner <gw*****@agricoreunited.com>
comp.lang.javascript FAQ - http://jibbering.com/faq

Jul 23 '05 #3
Also assigning anonymous functions as Grant Wagner suggests is quite fine.
There is more than a way to do it. Grant's way works as well, and is 100%
fine to the purpose.

The basic ideaboth share is: when assigning to events via script, be sure on
the "right side" of the assignement is a function - either function name or
function signature.

Once you get that, you have got the meaning of it all. Afterwards just pick
your choice accordingly to what you like best for your own personal
practice, both are valid options.

I don't prefer mine because it is mine LOL ;-)

ciao
Alberto
http://www.unitedscripters.com/
"Grant Wagner" <gw*****@agricoreunited.com> ha scritto nel messaggio
news:41***************@agricoreunited.com...
KS wrote:
Just to show some code to show the consept.

<img id="date" onclick="javascript:show_calendar();"
src="/PlexSysWeb/images/show-calendar.gif" width=20 height=18 border=0>


<img name="date" onclick="show_calendar();" ...>

or

<img id="dateId" name="dateName" onclick="show_calendar();" ...>
What i want the javascript to do is change the onclick value of the <IMG> tag above, by calling the test function from the same webpage by onclick on a button.

<input type="button" onclick="test()"value="test"/>

<script language='JavaScript'>

function test(){

document.all.date.onclick = "alert('kalenderdato')";


document.images['date'].onclick = function () { alert('kalenderdato'); }

or

var img;
if (document.getElementById) {
img = document.getElementById('dateId');
} else if (document.all) {
img = document.all['dateId'];
} else if (document.images) {
img = document.images['dateName'];
}
if (img) {
img.onclick = function () { alert('kalenderdato'); }
}
}

</script>

The problem is when i first click the button, and then the <IMG> tag on the same webpage, the script has not change it. I dont get the alert but the original onclick value from the IMG.


--
Grant Wagner <gw*****@agricoreunited.com>
comp.lang.javascript FAQ - http://jibbering.com/faq

Jul 23 '05 #4
On Wed, 18 Aug 2004 14:35:53 GMT, Grant Wagner
<gw*****@agricoreunited.com> wrote:

[snip]
var img;
if (document.getElementById) {
img = document.getElementById('dateId');
} else if (document.all) {
img = document.all['dateId'];
} else if (document.images) {
img = document.images['dateName'];
}


The images collection works just as well with names as it does ids. Except
in NN4, of course.

[snip]

Mike

--
Michael Winter
Replace ".invalid" with ".uk" to reply by e-mail
Jul 23 '05 #5
KS
Thanx the consept almost work the way I want. There is one problem.
I need to pass some value to the test function and when i do that like this.

function test(x,y){
document.all.date.onclick = "alert(x.value,y.value)";

}

I also have to call the test function by "test(x,y)" and not only "test".
What then happends is that the test function get displayed after hitting the
button and not only when hitting the img tag.
Any solution to this??
x and y can not be called directly in test function it. I wont go into
detail because I will demand a rather long explanation.

KS

"KS" <ka*****@hotmail.com> skrev i melding
news:41********@news.broadpark.no...
Just to show some code to show the consept.

<img id="date" onclick="javascript:show_calendar();"
src="/PlexSysWeb/images/show-calendar.gif" width=20 height=18 border=0>

What i want the javascript to do is change the onclick value of the <IMG>
tag above, by calling the test function from the same webpage by onclick on a button.

<input type="button" onclick="test()"value="test"/>

<script language='JavaScript'>

function test(){

document.all.date.onclick = "alert('kalenderdato')";

}

</script>

The problem is when i first click the button, and then the <IMG> tag on the same webpage, the script has not change it. I dont get the alert but the
original onclick value from the IMG.

KS

Jul 23 '05 #6
KS
Jusing x and y has global attributes, written outside any function, solved
the problem. Might not be the best way, since it would be better to narrow
the scope of the x and y attribute.
KS

"KS" <ka*****@hotmail.com> skrev i melding
news:41********@news.broadpark.no...
Thanx the consept almost work the way I want. There is one problem.
I need to pass some value to the test function and when i do that like this.
function test(x,y){
document.all.date.onclick = "alert(x.value,y.value)";

}

I also have to call the test function by "test(x,y)" and not only "test".
What then happends is that the test function get displayed after hitting the button and not only when hitting the img tag.
Any solution to this??
x and y can not be called directly in test function it. I wont go into
detail because I will demand a rather long explanation.

KS

"KS" <ka*****@hotmail.com> skrev i melding
news:41********@news.broadpark.no...
Just to show some code to show the consept.

<img id="date" onclick="javascript:show_calendar();"
src="/PlexSysWeb/images/show-calendar.gif" width=20 height=18 border=0>

What i want the javascript to do is change the onclick value of the <IMG> tag above, by calling the test function from the same webpage by onclick

on
a button.

<input type="button" onclick="test()"value="test"/>

<script language='JavaScript'>

function test(){

document.all.date.onclick = "alert('kalenderdato')";

}

</script>

The problem is when i first click the button, and then the <IMG> tag on

the
same webpage, the script has not change it. I dont get the alert but the original onclick value from the IMG.

KS


Jul 23 '05 #7
On Thu, 19 Aug 2004 09:46:00 +0200, KS <ka*****@hotmail.com> wrote:
Thanx the consept almost work the way I want. There is one problem.
I need to pass some value to the test function and when i do that like
this.

function test(x,y){
document.all.date.onclick = "alert(x.value,y.value)";

}


You can use this:

function test(x, y) {
document.images['date'].onclick = function() {
alert(x.value, y.value);
};
}

and x and y don't need to be global (to answer your problem in your other
post).

The function expression above forms what's called a closure. If you want
more details on what closures are and how they work, you can read about
them in the group's FAQ notes:

<URL:http://www.jibbering.com/faq/faq_notes/closures.html>

[snipped top-post]

Hope that helps,
Mike

--
Michael Winter
Replace ".invalid" with ".uk" to reply by e-mail.
Jul 23 '05 #8
KS
Nice, that solved it and the global isuee :)
KS

"Michael Winter" <M.******@blueyonder.co.invalid> skrev i melding
news:opscy1d5fxx13kvk@atlantis...
On Thu, 19 Aug 2004 09:46:00 +0200, KS <ka*****@hotmail.com> wrote:
Thanx the consept almost work the way I want. There is one problem.
I need to pass some value to the test function and when i do that like
this.

function test(x,y){
document.all.date.onclick = "alert(x.value,y.value)";

}


You can use this:

function test(x, y) {
document.images['date'].onclick = function() {
alert(x.value, y.value);
};
}

and x and y don't need to be global (to answer your problem in your other
post).

The function expression above forms what's called a closure. If you want
more details on what closures are and how they work, you can read about
them in the group's FAQ notes:

<URL:http://www.jibbering.com/faq/faq_notes/closures.html>

[snipped top-post]

Hope that helps,
Mike

--
Michael Winter
Replace ".invalid" with ".uk" to reply by e-mail.

Jul 23 '05 #9

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

Similar topics

15
by: Philipp Lenssen | last post by:
My friend has the following problem (background: we want to transform XML to XHTML via XSLT): "We copy XHTML fragments into an output by using the following template: <xsl:template match="*"...
5
by: MyndPhlyp | last post by:
I've been busting my head trying to figure this out for quite some time. With IE6 and NS7, no problems. I can simply code the HTML <img height="100%"> and be done with it. But NS4 and NS6 (and...
15
by: Gérard Talbot | last post by:
Hello all, I'd like to know and understand the difference between, say, <img src="/ImageFilename.png" width="123" height="456" alt=""> and <img src="/ImageFilename.png" style="width:...
3
by: Henry Johnson | last post by:
Okay - I'm spinning my wheels on this one... can someone help me figure out how to programmatically populate a table cell as follows (from C# code-behind)? I've tried using a Literal control in the...
10
by: News | last post by:
I am trying to be able to manipulate the width and height of an <img> but do not seem to be able. "Yes", I know the JavaScript will "not" manip anything, which is ok. I simply do not know how to...
4
by: SammyBar | last post by:
Hi all, I wonder is it possible to upload the content of an <imgfield to a server. The content of the <imgwas downloaded from a web site different from the one it should be uploaded. The image...
4
by: Jon Slaughter | last post by:
I have a captcha system going and for some reason when I use <?php $s = ""; for($i = 0; $i < 10; $i++) { $s = $s.rand(0,9); } $_SESSION = $s; $fn = '/Login/Register/Captcha.php'; echo '<img...
0
by: abbasky | last post by:
### Vandf component communication method one: data sharing ​ Vandf components can achieve data exchange through data sharing, state sharing, events, and other methods. Vandf's data exchange method...
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: fareedcanada | last post by:
Hello I am trying to split number on their count. suppose i have 121314151617 (12cnt) then number should be split like 12,13,14,15,16,17 and if 11314151617 (11cnt) then should be split like...
0
by: stefan129 | last post by:
Hey forum members, I'm exploring options for SSL certificates for multiple domains. Has anyone had experience with multi-domain SSL certificates? Any recommendations on reliable providers or specific...
0
Git
by: egorbl4 | last post by:
Скачал я git, хотел начать настройку, а там вылезло вот это Что это? Что мне с этим делать? ...
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: Aftab Ahmad | last post by:
So, I have written a code for a cmd called "Send WhatsApp Message" to open and send WhatsApp messaage. The code is given below. Dim IE As Object Set IE =...

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.