hola, tengo una funcion en javascript que me valida un campo cuando se hace click al evento boton, pero ademas de eso necesito que cuando se presione el boton aparezca una imagen que indica q se esta cargando la pagina, el resultado del boton es una tabla q se muestra en la misma pagina pero esa tabla tarda unu poco en mostrarse por la busqueda, mientras se hace la busqueda quiero q aparezca el simbolo de "cargando".
aqui les pongo mi codigo para q me ayuden por favor
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Consulta de Radios</title>
<link rel="stylesheet" type="text/css" media="screen" href="esti.css" />
<script language="javascript" type="text/javascript" src="ajax.js"></script>
<script>
function accion(url,div,cadena)
{
if(document.getElementById('radio').value=="")
{
alert("Debe colocar el nombre a Buscar");
}
else
{
var datos = cadena;
var div="#"+div;
$.ajax
(
{
async:true,
url: url,
type: 'POST',
dataType: 'html',
data: datos,
cache: false,
success: function(respuesta)
{
$(div).html(respuesta);
}
}
);
}
}
</script>
</head>
<body>
<div id="todo">
<div id="membrete">
<div id="logo">
</div>
</div>
</div>
<br>
<h3><p align="center">Ingrese el sitio a Buscar</p></h3>
<br>
<input type="text" name="radio" id="radio">
<input type="button" name="Buscar" value="Buscar" onclick="javascript:accion('tablaradio.php','respu esta','radio='+$('#radio').attr('value'))">
<br>
<br>
<div id="respuesta" align="center">
<div id="imagen" align="center">
<img src="imagenes/cargando.gif" alt=""><?php echo "Cargando...";?>
</div>
</div>
</body>
</html>
como pueden ver <div id="respuesta" align="center"> muestra el resultado de la consulta que viene del archivo tablaradio.php, pero antes de q se muestre esta tabla quiero q aparezca el simblo que esta en <img src="imagenes/cargando.gif" alt=""><?php echo "Cargando...";?>
¿Como lo hago por favor??? como lo valido con el javascript??
de todas maneras aqui les dejo un codigo q tengo para detectar la carga a ver si sirve:
window.onload = detectarCarga;
function detectarCarga()
{
document.getElementById("imagen").style.display="n one";
}