Select Row by Clicking on Row

[Total: 0    Average: 0/5]

Select the row by clicking on the row.

Head Code:

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

Body Code:

<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>

Times Viewed: 5

Leave a Reply

Your email address will not be published. Required fields are marked *