Hola de nuevo.
Bueno segun el ejemplo del principio.
modificado asi , funciona.
gracias de nuevo.
<html>
<head>
<title>color button
</title>
<script>
function ini() {
tab=document.getElementById('tabla');
for (i=0; ele=tab.getElementsByTagName('TR')[i]; i++) {
ele.onmouseover = function() {iluminar(this,true)};
ele.onmouseout = function() {iluminar(this,false)};
ele.cells[0].onclick = function() {marcar(this)};
}
}
function iluminar(obj,valor) {
estado = obj.getElementsByTagName("TD")[0].firstChild.checked;
if (!estado)
obj.style.backgroundColor = (valor) ? 'red' : 'white';
}
var marca = null;
function marcar(obj) {
if (marca != null && marca != obj) marca.parentNode.style.backgroundColor = "white";
marca = obj;
}
function ini2() {
tab2=document.getElementById('tabla2');
for (i=0; ele=tab2.getElementsByTagName('TR')[i]; i++) {
ele.onmouseover = function() {iluminar2(this,true)};
ele.onmouseout = function() {iluminar2(this,false)};
ele.cells[0].onclick = function() {marcar2(this)};
}
}
function iluminar2(obj,valor) {
estado = obj.getElementsByTagName("TD")[0].firstChild.checked;
if (!estado)
obj.style.backgroundColor = (valor) ? 'red' : 'white';
}
var marca2 = null;
function marcar2(obj) {
if (marca2 != null && marca2 != obj) marca2.parentNode.style.backgroundColor = "white";
marca2 = obj;
}
function ini3() {
tab3=document.getElementById('tabla3');
for (i=0; ele=tab3.getElementsByTagName('TR')[i]; i++) {
ele.onmouseover = function() {iluminar3(this,true)};
ele.onmouseout = function() {iluminar3(this,false)};
ele.cells[0].onclick = function() {marcar3(this)};
}
}
function iluminar3(obj,valor) {
estado = obj.getElementsByTagName("TD")[0].firstChild.checked;
if (!estado)
obj.style.backgroundColor = (valor) ? 'red' : 'white';
}
var marca3 = null;
function marcar3(obj) {
if (marca3 != null && marca3 != obj) marca3.parentNode.style.backgroundColor = "white";
marca3 = obj;
}
window.onload=function()
{
ini();
ini2();
ini3();
//
}
//window.onload = ini;
</script>
</head>
<body style="width:500px;align:center;margin:auto"
<table width="50%" align="center">
<tr><td>
<form id="formu">
<table id="tabla" border="1">
<tr>
<td><input type="radio" name="sex" value="1"></td>
<td>Hombre</td>
</tr>
<tr>
<td><input type="radio" name="sex" value="2"></td>
<td>Mujer</td>
</tr>
</table>
</form>
<form id="formu2">
<table id="tabla2" border="1">
<tr>
<td><input type="radio" name="lugar" value="1"></td>
<td>BARCELONA</td>
</tr>
<tr>
<td><input type="radio" name="lugar" value="2"></td>
<td>Otra provincia</td>
</tr>
<tr>
<td><input type="radio" name="lugar" value="3"></td>
<td>Otro pais</td>
</tr>
</table>
</form>
<form id="formu3">
<table id="tabla3" border="1">
<tr>
<td><input type="radio" name="motivo" value="1"></td>
<td>leer</td>
</tr>
<tr>
<td><input type="radio" name="motivo" value="2"></td>
<td>escribir</td>
</tr>
<tr>
<td><input type="radio" name="motivo" value="3"></td>
<td>leer-escribir</td>
</tr>
</table>
</form>
</td></tr>
</table>
</body>
</html>