PDA

View Full Version : Is the onclick event supported within an img tag by NS4

Jeepers
09-14-2002, 03:21 PM
Hi Guys an Gals

Specifically, I need the onclick event to document.formname.reset() from within an <img bla bla bla> tag , ‘cause the standard reset button sucks. If I use an input tag with type=”image” it submits the form (bad news). I know I could just miss out the reset button in NS4 but there will be other forms that will need the onclick event to call a function to submit etc etc.

Have I got all of this wrong, if not is there a way to submit and reset via javascript inside an img tag in NS4.
Nomadicus
09-14-2002, 03:43 PM
I don't have an answer for you, but my best guess is "no."

I've used only IE for the past several years. The last time I used NS was like version 2.0. Now I like to create my own buttons, some of which I do in PHP. Why? Because I started using PHP long before I started using JS. And I've even gotten the two languages to talk to each other, with pretty good success.

I also like to highlight a lot of links for my users, just so they will know there's something there. That little finger going up is missed by a lot of people. So this requires an "onMouseOver" event and then calling a JS function to do the highlighting. It's really pretty simple -- standard stuff.

But one of my users was complaining that she didn't see this highlighting taking place. It turns out that she is using NS 4.2. I asked her to try a machine with IE on it. Presto! Everything works just fine -- but again, not with NS.

Well, I also recently read that IE now has about 97 percent of the market. So I think I am just going to forget about NS. Why should I spend anytime trying to code for NS at this point, seeing how their market share keeps dropping, and seeing how they can't even get their act together to support events like onMouseOver!

And they invented this freaking stuff!

Ok, that's my 2 cents worth. I'm no fan of Microsquash, but NetScape has really dropped the ball lately.
brothercake
09-14-2002, 04:30 PM
There are a couple of ways of trapping mouse events.

The first is to enclose it with a layer and set up event listeners for those layers. That way is more complex - but I'll give the details if you want.

The easier way is to use an enclosing anchor

<a href="javascript:submitForm()"><img ... ></a>
adios
09-15-2002, 01:36 AM
A little reading:

http://www.cs.tut.fi/~jkorpela/forms/imagereset.html

http://www.idocs.com/tags/forms/index_famsupp_156.html

One approach:


<html>
<head>
<title>untitled</title>
<script type="text/javascript" language="javascript">

function subMover() {this.src='http://www.idocs.com/tags/forms/go2.over.gif'}
function subMout() {this.src='http://www.idocs.com/tags/forms/go2.gif'; this.clicked=false;}
function subMdown() {this.clicked = true;}
function subMup() {if (this.clicked) document.demo.submit(); this.clicked = false;}
function resMover() {this.src='http://www.idocs.com/tags/forms/reset.over.gif'}
function resMout() {this.src='http://www.idocs.com/tags/forms/reset.gif'; this.clicked=false;}
function resMdown() {this.clicked = true;}
function resMup() {if (this.clicked && confirm('Reset the form?')) document.demo.reset(); this.clicked = false;}

</script>
</head>
<body>
<form name="demo" action="javascript:alert('Submitted !')" method="post">
<input type="text" />
<img align="absmiddle" border="0" src="http://www.idocs.com/tags/forms/go2.gif"
onload="this.onmouseover=subMover;this.onmouseout=subMout;this.onmousedown=subMdown;this.onmouseup=subMup;" />
<img align="absmiddle" border="0" src="http://www.idocs.com/tags/forms/reset.gif"
onload="this.onmouseover=resMover;this.onmouseout=resMout;this.onmousedown=resMdown;this.onmouseup=resMup;" />
</form>
</body>
</html>