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

**Alberto** · Jul 23 '05, 01:08 PM

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

Rearrange it as follows:

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

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

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

<body>
<img id="date" onClick="show_c alendar();"
src="a.gif" width=200 height=100 border=0>
<form><input type="button" onclick="test() "value="tes t"/></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.getEle mentById 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" <katos75@hotmai l.com> ha scritto nel messaggio
news:41236589$1 @news.broadpark .no...[color=blue]
> Just to show some code to show the consept.
>
> <img id="date" onclick="javasc ript:show_calen dar();"
> 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[/color]
on[color=blue]
> a button.
>
> <input type="button" onclick="test() "value="tes t"/>
>
> <script language='JavaS cript'>
>
> function test(){
>
> document.all.da te.onclick = "alert('kalende rdato')";
>
> }
>
> </script>
>
>
>
> The problem is when i first click the button, and then the <IMG> tag on[/color]
the[color=blue]
> same webpage, the script has not change it. I dont get the alert but the
> original onclick value from the IMG.
>
> KS
>
>[/color]

**Grant Wagner** · Jul 23 '05, 01:08 PM

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

KS wrote:
[color=blue]
> Just to show some code to show the consept.
>
> <img id="date" onclick="javasc ript:show_calen dar();"
> src="/PlexSysWeb/images/show-calendar.gif" width=20 height=18 border=0>[/color]

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

or

<img id="dateId" name="dateName" onclick="show_c alendar();" ...>
[color=blue]
> 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="tes t"/>
>
> <script language='JavaS cript'>
>
> function test(){
>
> document.all.da te.onclick = "alert('kalende rdato')";[/color]

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

or

var img;
if (document.getEl ementById) {
img = document.getEle mentById('dateI d');
} else if (document.all) {
img = document.all['dateId'];
} else if (document.image s) {
img = document.images['dateName'];
}
if (img) {
img.onclick = function () { alert('kalender dato'); }
}
[color=blue]
> }
>
> </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.[/color]

--
Grant Wagner <gwagner@agrico reunited.com>
comp.lang.javas cript FAQ - http://jibbering.com/faq

**Alberto** · Jul 23 '05, 01:08 PM

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

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" <gwagner@agrico reunited.com> ha scritto nel messaggio
news:41236991.D B83F55D@agricor eunited.com...[color=blue]
> KS wrote:
>[color=green]
> > Just to show some code to show the consept.
> >
> > <img id="date" onclick="javasc ript:show_calen dar();"
> > src="/PlexSysWeb/images/show-calendar.gif" width=20 height=18 border=0>[/color]
>
> <img name="date" onclick="show_c alendar();" ...>
>
> or
>
> <img id="dateId" name="dateName" onclick="show_c alendar();" ...>
>[color=green]
> > What i want the javascript to do is change the onclick value of the[/color][/color]
<IMG>[color=blue][color=green]
> > tag above, by calling the test function from the same webpage by onclick[/color][/color]
on[color=blue][color=green]
> > a button.
> >
> > <input type="button" onclick="test() "value="tes t"/>
> >
> > <script language='JavaS cript'>
> >
> > function test(){
> >
> > document.all.da te.onclick = "alert('kalende rdato')";[/color]
>
> document.images['date'].onclick = function () { alert('kalender dato'); }
>
> or
>
> var img;
> if (document.getEl ementById) {
> img = document.getEle mentById('dateI d');
> } else if (document.all) {
> img = document.all['dateId'];
> } else if (document.image s) {
> img = document.images['dateName'];
> }
> if (img) {
> img.onclick = function () { alert('kalender dato'); }
> }
>[color=green]
> > }
> >
> > </script>
> >
> > The problem is when i first click the button, and then the <IMG> tag on[/color][/color]
the[color=blue][color=green]
> > same webpage, the script has not change it. I dont get the alert but[/color][/color]
the[color=blue][color=green]
> > original onclick value from the IMG.[/color]
>
> --
> Grant Wagner <gwagner@agrico reunited.com>
> comp.lang.javas cript FAQ - http://jibbering.com/faq
>[/color]

**Michael Winter** · Jul 23 '05, 01:08 PM

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

On Wed, 18 Aug 2004 14:35:53 GMT, Grant Wagner
<gwagner@agrico reunited.com> wrote:

[snip]
[color=blue]
> var img;
> if (document.getEl ementById) {
> img = document.getEle mentById('dateI d');
> } else if (document.all) {
> img = document.all['dateId'];
> } else if (document.image s) {
> img = document.images['dateName'];
> }[/color]

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

KS · Jul 23 '05, 01:09 PM

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

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.da te.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" <katos75@hotmai l.com> skrev i melding
news:41236589$1 @news.broadpark .no...[color=blue]
> Just to show some code to show the consept.
>
> <img id="date" onclick="javasc ript:show_calen dar();"
> 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[/color]
on[color=blue]
> a button.
>
> <input type="button" onclick="test() "value="tes t"/>
>
> <script language='JavaS cript'>
>
> function test(){
>
> document.all.da te.onclick = "alert('kalende rdato')";
>
> }
>
> </script>
>
>
>
> The problem is when i first click the button, and then the <IMG> tag on[/color]
the[color=blue]
> same webpage, the script has not change it. I dont get the alert but the
> original onclick value from the IMG.
>
> KS
>
>[/color]

KS · Jul 23 '05, 01:09 PM

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

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" <katos75@hotmai l.com> skrev i melding
news:41245a61$1 @news.broadpark .no...[color=blue]
> 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[/color]
this.[color=blue]
>
> function test(x,y){
> document.all.da te.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[/color]
the[color=blue]
> 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" <katos75@hotmai l.com> skrev i melding
> news:41236589$1 @news.broadpark .no...[color=green]
> > Just to show some code to show the consept.
> >
> > <img id="date" onclick="javasc ript:show_calen dar();"
> > 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[/color][/color]
<IMG>[color=blue][color=green]
> > tag above, by calling the test function from the same webpage by onclick[/color]
> on[color=green]
> > a button.
> >
> > <input type="button" onclick="test() "value="tes t"/>
> >
> > <script language='JavaS cript'>
> >
> > function test(){
> >
> > document.all.da te.onclick = "alert('kalende rdato')";
> >
> > }
> >
> > </script>
> >
> >
> >
> > The problem is when i first click the button, and then the <IMG> tag on[/color]
> the[color=green]
> > same webpage, the script has not change it. I dont get the alert but[/color][/color]
the[color=blue][color=green]
> > original onclick value from the IMG.
> >
> > KS
> >
> >[/color]
>
>[/color]

**Michael Winter** · Jul 23 '05, 01:09 PM

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

On Thu, 19 Aug 2004 09:46:00 +0200, KS <katos75@hotmai l.com> wrote:
[color=blue]
> 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.da te.onclick = "alert(x.value, y.value)";
>
> }[/color]

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.c om/faq/faq_notes/closures.html>

[snipped top-post]

Hope that helps,
Mike

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

KS · Jul 23 '05, 01:09 PM

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

Nice, that solved it and the global isuee :)
KS

"Michael Winter" <M.Winter@bluey onder.co.invali d> skrev i melding
news:opscy1d5fx x13kvk@atlantis ...[color=blue]
> On Thu, 19 Aug 2004 09:46:00 +0200, KS <katos75@hotmai l.com> wrote:
>[color=green]
> > 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.da te.onclick = "alert(x.value, y.value)";
> >
> > }[/color]
>
> 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.c om/faq/faq_notes/closures.html>
>
> [snipped top-post]
>
> Hope that helps,
> Mike
>
> --
> Michael Winter
> Replace ".invalid" with ".uk" to reply by e-mail.[/color]

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

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

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment