onclick on IE7 in table elements

Marko Mikkonen

I'm trying to make code which does something when user clicks a row in a
table. I tried a javascript code from JS-Examples.com. It works on
Firefox, but not on Internet explorer 7. Here's the code:

<html>
<head>


<style>
..c1 {background-color: #ACF;}
..c2 {background-color: #FCA;}
..c3 {background-color: #CFA;}
</style>
<script>
function ov(i)
{
document.getEle mentById(i).cla ssName="c3";
}
function ot(i,c)
{
document.getEle mentById(i).cla ssName=c;
}
function click(num)
{
alert("You choose Item #"+num);
}
</script>

</head>
<body>

<table>
<tr id=i1 class=c1 onclick='click( 1)' onmouseover='ov ("i1")'
onmouseout='ot( "i1","c1")'><td >one</td><td>two</td><td>three</td></tr>
<tr id=i2 class=c2 onclick='click( 2)' onmouseover='ov ("i2")'
onmouseout='ot( "i2","c2")'><td >one</td><td>two</td><td>three</td></tr>
<tr id=i3 class=c1 onclick='click( 3)' onmouseover='ov ("i3")'
onmouseout='ot( "i3","c1")'><td >one</td><td>two</td><td>three</td></tr>
<tr id=i4 class=c2 onclick='click( 4)' onmouseover='ov ("i4")'
onmouseout='ot( "i4","c2")'><td >one</td><td>two</td><td>three</td></tr>
<tr id=i5 class=c1 onclick='click( 5)' onmouseover='ov ("i5")'
onmouseout='ot( "i5","c1")'><td >one</td><td>two</td><td>three</td></tr>
</table>
<BR><center>< a
href='http://www.js-examples.com'>J S-Examples.com</a></center>
</body>
</html>

I also tried moving the onclick under td tags, but still IE 7 wouldn't
work. Onmouseover and onmouseout events seem to work fine in both IE7 and
Firefox.

Does the code work for you on IE7? What could be the problem?

-Marko

May 11 '07 #1

Subscribe Reply

4897

ASM

Marko Mikkonen a écrit :

I'm trying to make code which does something when user clicks a row in a
table. I tried a javascript code from JS-Examples.com. It works on
Firefox, but not on Internet explorer 7. Here's the code:

<html>
<head>


<style>
.c1 {background-color: #ACF;}
.c2 {background-color: #FCA;}
.c3 {background-color: #CFA;}
</style>
<script>

function ov(i)
{
document.getEle mentById(i).cla ssName="c3";

document.getEle mentById('i'+i) .className="c3" ;

}
function ot(i,c)
{
document.getEle mentById(i).cla ssName=c;

document.getEle mentById('i'+i) .className=c;

}
function click(num)
{
alert("You choose Item #"+num);
}
</script>

</head>
<body>

<table>
<tr id=i1 class=c1 onclick='click( 1)' onmouseover='ov ("i1")'
onmouseout='ot( "i1","c1")'><td >one</td><td>two</td><td>three</td></tr>
<tr id=i2 class=c2 onclick='click( 2)' onmouseover='ov ("i2")'
onmouseout='ot( "i2","c2")'><td >one</td><td>two</td><td>three</td></tr>
<tr id=i3 class=c1 onclick='click( 3)' onmouseover='ov ("i3")'
onmouseout='ot( "i3","c1")'><td >one</td><td>two</td><td>three</td></tr>
<tr id=i4 class=c2 onclick='click( 4)' onmouseover='ov ("i4")'
onmouseout='ot( "i4","c2")'><td >one</td><td>two</td><td>three</td></tr>
<tr id=i5 class=c1 onclick='click( 5)' onmouseover='ov ("i5")'
onmouseout='ot( "i5","c1")'><td >one</td><td>two</td><td>three</td></tr>
</table>
<BR><center>< a
href='http://www.js-examples.com'>J S-Examples.com</a></center>
</body>
</html>

--
Stephane Moriaux et son (moins) vieux Mac déjà dépassé
Stephane Moriaux and his (less) old Mac already out of date

May 11 '07 #2

Marko Mikkonen

You just touched ov and ot functions! And they worked fine (untill you
touched them :| )! The problem is the click function. Anyone?

ASM <st************ *********@wanad oo.fr.invalidwr ote:

Marko Mikkonen a écrit :
I'm trying to make code which does something when user clicks a row in a
table. I tried a javascript code from JS-Examples.com. It works on
Firefox, but not on Internet explorer 7. Here's the code:

<html>
<head>


<style>
.c1 {background-color: #ACF;}
.c2 {background-color: #FCA;}
.c3 {background-color: #CFA;}
</style>
<script>

<script type="text/javascript">

function ov(i)
{
document.getEle mentById(i).cla ssName="c3";

document.getEle mentById('i'+i) .className="c3" ;

}
function ot(i,c)
{
document.getEle mentById(i).cla ssName=c;

document.getEle mentById('i'+i) .className=c;

}
function click(num)
{
alert("You choose Item #"+num);
}
</script>

</head>
<body>

<table>
<tr id=i1 class=c1 onclick='click( 1)' onmouseover='ov ("i1")'
onmouseout='ot( "i1","c1")'><td >one</td><td>two</td><td>three</td></tr>
<tr id=i2 class=c2 onclick='click( 2)' onmouseover='ov ("i2")'
onmouseout='ot( "i2","c2")'><td >one</td><td>two</td><td>three</td></tr>
<tr id=i3 class=c1 onclick='click( 3)' onmouseover='ov ("i3")'
onmouseout='ot( "i3","c1")'><td >one</td><td>two</td><td>three</td></tr>
<tr id=i4 class=c2 onclick='click( 4)' onmouseover='ov ("i4")'
onmouseout='ot( "i4","c2")'><td >one</td><td>two</td><td>three</td></tr>
<tr id=i5 class=c1 onclick='click( 5)' onmouseover='ov ("i5")'
onmouseout='ot( "i5","c1")'><td >one</td><td>two</td><td>three</td></tr>
</table>
<BR><center>< a
href='http://www.js-examples.com'>J S-Examples.com</a></center>
</body>
</html>

--
Stephane Moriaux et son (moins) vieux Mac déjà dépassé
Stephane Moriaux and his (less) old Mac already out of date

May 14 '07 #3

Marko Mikkonen

I found out the cause of the problem. I changed the function click's name to
something else (like dothatclick). Apparently "click" is a reserved word or such
in IE7?

Marko Mikkonen <mm******@paju. oulu.fiwrote:

You just touched ov and ot functions! And they worked fine (untill you
touched them :| )! The problem is the click function. Anyone?

ASM <st************ *********@wanad oo.fr.invalidwr ote:
Marko Mikkonen a ?crit :
I'm trying to make code which does something when user clicks a row in a
table. I tried a javascript code from JS-Examples.com. It works on
Firefox, but not on Internet explorer 7. Here's the code:
>
<html>
<head>

>
<style>
.c1 {background-color: #ACF;}
.c2 {background-color: #FCA;}
.c3 {background-color: #CFA;}
</style>
<script>

<script type="text/javascript">

function ov(i)
{
document.getEle mentById(i).cla ssName="c3";

document.getEle mentById('i'+i) .className="c3" ;

}
function ot(i,c)
{
document.getEle mentById(i).cla ssName=c;

document.getEle mentById('i'+i) .className=c;

}
function click(num)
{
alert("You choose Item #"+num);
}
</script>

</head>
<body>
>
<table>
<tr id=i1 class=c1 onclick='click( 1)' onmouseover='ov ("i1")'
onmouseout='ot( "i1","c1")'><td >one</td><td>two</td><td>three</td></tr>
<tr id=i2 class=c2 onclick='click( 2)' onmouseover='ov ("i2")'
onmouseout='ot( "i2","c2")'><td >one</td><td>two</td><td>three</td></tr>
<tr id=i3 class=c1 onclick='click( 3)' onmouseover='ov ("i3")'
onmouseout='ot( "i3","c1")'><td >one</td><td>two</td><td>three</td></tr>
<tr id=i4 class=c2 onclick='click( 4)' onmouseover='ov ("i4")'
onmouseout='ot( "i4","c2")'><td >one</td><td>two</td><td>three</td></tr>
<tr id=i5 class=c1 onclick='click( 5)' onmouseover='ov ("i5")'
onmouseout='ot( "i5","c1")'><td >one</td><td>two</td><td>three</td></tr>
</table>
<BR><center>< a
href='http://www.js-examples.com'>J S-Examples.com</a></center>
</body>
</html>

--
Stephane Moriaux et son (moins) vieux Mac d?j? d?pass?
Stephane Moriaux and his (less) old Mac already out of date

May 14 '07 #4

ASM

Marko Mikkonen a écrit :

You just touched ov and ot functions! And they worked fine (untill you
touched them :| )! The problem is the click function. Anyone?

touch the click function as ov and ot were ... no ?

the easiest way would be :

someElement.onc lick = function() { aFunction(this) ; };
<html>
<script type="text/javascript">
function whatIs(what) {
alert('somethin g to do with ' + what.id);
}
function roll(what) {
what = what.style;
what.background Color = what.background Color==''?
'yellow' : '';
}
var IE=false; /*@cc_on IE=true; @*/
onload = function() {
var p = document.getEle mentsByTagName( 'P');
for(var i=0; i<p.length; i++) {
p[i].onclick = function() { whatIs(this); };
p[i].onmouseover = function() { roll(this); };
p[i].onmouseout = function() { roll(this); };
p[i].cursor = IE? 'hand' : 'pointer';
}
}
</script>
<p id="text_1"tex t 1 </p>
<p id="text_2"tex t 2 </p>
<p id="text_3"tex t 3 </p>
</html>
to adapt to your table ...

>
ASM <st************ *********@wanad oo.fr.invalidwr ote:
>Marko Mikkonen a écrit :
>>I'm trying to make code which does something when user clicks a row in a
table. I tried a javascript code from JS-Examples.com. It works on
Firefox, but not on Internet explorer 7. Here's the code:

<html>
<head>


<style>
.c1 {background-color: #ACF;}
.c2 {background-color: #FCA;}
.c3 {background-color: #CFA;}
</style>
<script>

><script type="text/javascript">

>>function ov(i)
{
document.getEle mentById(i).cla ssName="c3";

> document.getEle mentById('i'+i) .className="c3" ;

>>}
function ot(i,c)
{
document.getEle mentById(i).cla ssName=c;

> document.getEle mentById('i'+i) .className=c;

>>}
function click(num)
{
alert("You choose Item #"+num);
}
</script>

>></head>
<body>

<table>
<tr id=i1 class=c1 onclick='click( 1)' onmouseover='ov ("i1")'
onmouseout='o t("i1","c1")'>< td>one</td><td>two</td><td>three</td></tr>
<tr id=i2 class=c2 onclick='click( 2)' onmouseover='ov ("i2")'
onmouseout='o t("i2","c2")'>< td>one</td><td>two</td><td>three</td></tr>
<tr id=i3 class=c1 onclick='click( 3)' onmouseover='ov ("i3")'
onmouseout='o t("i3","c1")'>< td>one</td><td>two</td><td>three</td></tr>
<tr id=i4 class=c2 onclick='click( 4)' onmouseover='ov ("i4")'
onmouseout='o t("i4","c2")'>< td>one</td><td>two</td><td>three</td></tr>
<tr id=i5 class=c1 onclick='click( 5)' onmouseover='ov ("i5")'
onmouseout='o t("i5","c1")'>< td>one</td><td>two</td><td>three</td></tr>
</table>
<BR><center>< a
href='http://www.js-examples.com'>J S-Examples.com</a></center>
</body>
</html>

>--
Stephane Moriaux et son (moins) vieux Mac déjà dépassé
Stephane Moriaux and his (less) old Mac already out of date

--
Stephane Moriaux et son (moins) vieux Mac déjà dépassé
Stephane Moriaux and his (less) old Mac already out of date
Contact : http://stephane.moriaux.perso.wanadoo.fr/contact
ASM = Aimable Stéphane Moriaux = Amateur Sasseur Merdouilles

May 14 '07 #5

ASM

Marko Mikkonen a écrit :

I found out the cause of the problem. I changed the function click's name to
something else (like dothatclick). Apparently "click" is a reserved word or such
in IE7?

Ho ! I'vn't take care of that !

click() is a JS native function to simulate a mouse click

document.myForm .myElement.clic k()

You can use : function Click() { blah }
http://fr.selfhtml.org/navigation/recherche/index.htm
(in french, but the reserved words are the same :-) )

--
Stephane Moriaux et son (moins) vieux Mac déjà dépassé
Stephane Moriaux and his (less) old Mac already out of date

May 14 '07 #6

Marko Mikkonen

Ok, thank you.

ASM <st************ *********@wanad oo.fr.invalidwr ote:

Marko Mikkonen a écrit :
I found out the cause of the problem. I changed the function click's name to
something else (like dothatclick). Apparently "click" is a reserved word or such
in IE7?

Ho ! I'vn't take care of that !

click() is a JS native function to simulate a mouse click

document.myForm .myElement.clic k()

You can use : function Click() { blah }

http://fr.selfhtml.org/navigation/recherche/index.htm
(in french, but the reserved words are the same :-) )

--
Stephane Moriaux et son (moins) vieux Mac déjà dépassé
Stephane Moriaux and his (less) old Mac already out of date

May 14 '07 #7

Similar topics

6645

grab cell (<TD>) bgcolor with onClick and put it in a input type text...

by: A.S. | last post by:

Hi, I have the following simple code: <TABLE><TR> <TD BGCOLOR="#FFFFFF" ONCLICK="myform.color.value = this.bgcolor">hello</TD> </TR></TABLE> <FORM ACTION="hello.cgi" NAME="myform" ID="myform">

Javascript

8384

onClick onUnClick ???

by: Edward | last post by:

The code shown below displays a table in a form with 3 check boxes. When the left checkbox is selected, all other checkboxes are also selected (hotmail style) (thanks for the groups help with this). The onUnCick event doesn't work. Could anyone tell me how to correct it?? Thanks, Ed

Javascript

7042

onClick, onChange problems with form submit

by: Andy Goldstein | last post by:

I have a table where all the TRs have an onClick handler registered. One (and only one) of the rows has 2 text input boxes, where each textbox has an onChange handler registered. Both the onClick and onChange handlers do some minor manipulation of form data (although they work on different form elements). If the onChange event fires, I need the form to be submitted. If the onClick event fires for a TR, I also need the form to be...

Javascript

9573

dynamically add a table row with onclick

by: cool2005 | last post by:

I tried to dynamically add/clone a <tr> from an existing <tr> to a <table> but the problem is that I need to have a "onclick" event handler in the <tr>. I have tried following A. approach 1. 1. find the <tr> that I will insert <tr>s right after it

Javascript

12233

Code behind and onclick on html table row

by: Corno | last post by:

Hi all, I have a page with a table of which the rows have to be added dynamically. What I also want is 'code behind' the onclick event of a row (the page should be posted back to the server, which should handle the onclick). However, as the rows are added dynamically, I cannot give them an ID at designtime and attach a function to it. Is there a way to write one function for all added rows but that is able to distinguish which of the...

ASP.NET

2102

window.onclick in IE and Gecko agents

by: Luke Matuszewski | last post by:

Why window.onclick isn't fired in IE and is fired on Gecko agents ? <html onclick="alert('Event is now at the HTML element.')"> <head> <title>Event Bubbles</title> <script type="text/javascript"> function init() { document.onclick = docEvent; window.onclick = winEvent

Javascript

3033

Modifying A tag onclick events dynamically - am I crazy

by: GaryB | last post by:

Hi Guys, I've been battling with this one for hours - I hope that you can help me! My code modifies the <aon a page, from a standard document link into a link with a tailored onclick event. It works perfectly (assigning the correct images and the correct onclick events to the correct <atags):

Javascript

11214

Dynamically adding an onClick event.

by: Daz | last post by:

Hello everyone. I am sure the answer to my question is simple, but I can't seem to dynamically add an onClick event to my script. I have a table which is generated dynamically, I am just struggling getting an onClick event to show in the HTML source. Any help would be appreciated. Here is a block of my current code which doesn't work. var tr1 = document.createElement('tr');

Javascript

1385

IE / FF onclick behaviour and "this"

by: PlutoPlanet | last post by:

Hello World, the code below shows 2 elements with "onClicks". In IE all 3 values are alerted when clicking one of the elements In FF only "this.id" is alerted on the table element and "this.id" and "this.name" on the button element. Is it possible to pass anything other than "this.id" (or a const string) to a function which fired by onclick in FF?

Javascript

9589

What is ONU?

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, people are often confused as to whether an ONU can Work As a Router. In this blog post, we’ll explore What is ONU, What Is Router, ONU & Router’s main usage, and What is the difference between ONU and Router. Let’s take a closer look ! Part I. Meaning of...

General

10219

Problem With Comparison Operator <=> in G++

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, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed. This is as boiled down as I can make it. Here is my compilation command: g++-12 -std=c++20 -Wnarrowing bit_field.cpp Here is the code in...

C / C++

9998

The easy way to turn off automatic updates for Windows 10/11

by: Hystou | last post by:

Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For most users, this new feature is actually very convenient. If you want to control the update process,...

Windows Server

9865

Discussion: How does Zigbee compare with other wireless protocols in smart home applications?

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 protocol has its own unique characteristics and advantages, but as a user who is planning to build a smart home system, I am a bit confused by the choice of these technologies. I'm particularly interested in Zigbee because I've heard it does some...

General

8876

AI Job Threat for Devs

by: agi2029 | last post by:

Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then launch it, all on its own.... Now, this would greatly impact the work of software developers. The idea...

Career Advice

6675

Couldn’t get equations in html when convert word .docx file to html file in C#.

by: conductexam | last post by:

I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and then checking html paragraph one by one. At the time of converting from word file to html my equations which are in the word document file was convert into image. Globals.ThisAddIn.Application.ActiveDocument.Select();...

C# / C Sharp

5310

Trying to create a lan-to-lan vpn between two differents networks

by: TSSRALBI | last post by:

Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols. I succeeded, with both firewalls in the same network. But I'm wondering if it's possible to do the same thing, with 2 Pfsense firewalls...

Networking - Hardware / Configuration

5448

Windows Forms - .Net 8.0

by: adsilva | last post by:

A Windows Forms form does not have the event Unload, like VB6. What one acts like?

Visual Basic .NET

3967

transfer the data from one system to another through ip address

by: 6302768590 | last post by:

Hai team i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated we have to send another system

C# / C Sharp