Cargar ajax con el evento load jquery
En el siguiente ejemplo se cargará mediante load el contenido del archivo ajax.html en el archivo index.html.
$("#div").load("archivo.html", function() {
// la instrucción que quieras tras haber cargado el archivo
}
Para verlo mejor puedes hacer click en el siguiente botón ...
index.html
<!-- By http://jquery-manual.blogspot.com -->
<!DOCTYPE HTML>
<html>
<head>
<script type='text/javascript' src='http://code.jquery.com/jquery-1.7.2.min.js'></script>
<script type="text/javascript">
$(document).ready(function() {
$(":button#boton").click(function(){
$("#caja").load("ajax.html");
});
});
</script>
<style>
#caja{
width: 200px;
height: 15px;
background-color: yellow;
border-style: solid;
border-color: blue;
border-width: 3px;
font-family: Verdana;
padding: 20px;
font-size: 12px;
text-align: center;
color: blue;
}
</style>
</head>
<body>
<input type="button" id="boton" value="Cargar el Ajax con load">
<div id="caja"></div>
</body>
</html>
ajax.html ...
<script type="text/javascript">
var milisegundos = 5000;
tiempo = setTimeout("time()", milisegundos);
document.getElementById("texto").innerHTML = "Espere, por favor ...";
function time() {
tiempo = setTimeout("time()", milisegundos);
if (milisegundos)
{
document.getElementById("texto").innerHTML = "Ya se ha cargado el Ajax";
}
}
</script>
<b id="texto"></b>
No hay comentarios:
Publicar un comentario