hola, intente realizar algo basico para probar esta funcion, pero no me llegó a cargar el contenido de la pagina que quería.
tengo un cd que me vino con un libro de javascript, ejecute el ejercicio resuelto donde usaban la funcion load(), y yo hago click y no me aparece contenido de otra pagina.quizá tengo que habilitar algo o nose a que se pueda deber esto.ayuda por favor.
pd: otros ejercicios de este cd, funcionan correctamente.
Y el codigo? :P
Podes leer sobre esta funcion en la pagina oficial de jquery.
.load()
http://api.jquery.com/load/ (http://api.jquery.com/load/)
Referenciaste primero la libreria de jquery :xD ?
hola, bueno... ahí lees dejo el codigo del ejemplo del cd de js:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Quis Nostrud</title>
<link href="../css/global.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="../js/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#links a').click(function() {
var url=$(this).attr('href');
$('#headlines').load(url + ' #newsItems');
return false;
});
});
</script>
</head>
<body id="threeCol">
<div id="container">
<div id="banner"><img src="../images/banner.png" alt="javascript: The Missing Manual" width="760" height="65"><span id="badge"><a href="http://www.sawmac.com/missing/js/"></a></span></div>
<div id="contentWrap">
<div id="main">
<h1>Using jQuery’s load() Function</h1>
<h2>Headlines</h2>
<ul id="links">
<li><a href="today.html">Today’s News</a></li>
<li><a href="yesterday.html">Yesterday’s News</a></li>
<li><a href="lastweek.html">Last Week’s News</a></li>
</ul>
</div>
<div id="sidebar">
<h2>Script 11.1</h2>
</div>
</div>
<div id="news">
<h2>News Headlines</h2>
<div id="headlines"></div>
</div>
<div id="footer"><em>“Building Interactive Web Sites with javascript”</em></div>
</div>
</body>
</html>
y aquí la pagina, de la cual cargaré:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Quis Nostrud</title>
<link href="../css/global.css" rel="stylesheet" type="text/css">
</head>
<body id="twoCol">
<div id="container">
<div id="banner"><img src="../images/banner.png" alt="javascript: The Missing Manual" width="760" height="65"><span id="badge"><a href="http://www.sawmac.com/missing/js/"></a></span></div>
<div id="contentWrap">
<div id="main">
<h1>Headline News</h1>
<div id="newsItems">
<h3 class="date">Today’s News</h3>
<h3>Labore et dolore</h3>
<p>Quis nostrud exercitation ut labore et dolore magna aliqua. Sed do eiusmod tempor incididunt cupidatat non proident, duis aute irure dolor. Consectetur adipisicing elit, velit esse cillum dolore ut aliquip ex ea commodo consequat. Ullamco laboris nisi ut enim ad minim veniam. Ut enim ad minim veniam, lorem ipsum dolor sit amet, ut labore et dolore magna aliqua.</p>
<h3>Quis nostrud exercitation</h3>
<p> ut labore et dolore magna aliqua. Sed do eiusmod tempor incididunt cupidatat non proident, duis aute irure dolor. Consectetur adipisicing elit, velit esse cillum dolore ut aliquip ex ea commodo consequat. Ullamco laboris nisi ut enim ad minim veniam. Ut enim ad minim veniam, lorem ipsum dolor sit amet, ut labore et dolore magna aliqua.</p>
</div>
<h2> </h2>
</div>
<div id="sidebar">
<h2>Headline News</h2>
</div>
</div>
<div id="footer"><em>“Building Interactive Web Sites with javascript”</em></div>
</div>
</body>
</html>
gracias por comentar.salu2.
Hola a mi me funciona bien, como deberia... estas seguro que estas enlazando el archivo js correctamente ?
<script type="text/javascript" src="../js/jquery.js"></script>
Yo en mi caso, enlaze directamente desde el oficial
<script src="http://code.jquery.com/jquery-latest.js"></script>
Probé el script y funciona correctamente.
podrias probarlo en google chrome por favor.
ya lo probe en explorer 9, y firefox y si me carga bien. pero da problems en el google chrome, no me carga el contenido que debiera salir.
alguna sugerencia.gracias por comentar.salu2.
pd: ya corrobore de que esté habilitado el javascript, y aun no funka en google chrome.help me!.
Probá enlazando directamente con 127.0.0.1, por ejemplo
<ul id="links">
<li><a href="http://127.0.0.1/archivo/today.html">Today’s News</a></li>
<li><a href="http://127.0.0.1/archivo/yesterday.html">Yesterday’s News</a></li>
<li><a href="http://127.0.0.1/archivo/lastweek.html">Last Week’s News</a></li>
</ul>
Probá y contanos
@efex, ya le puse:
<li><a href="http://127.0.0.1/today.html">Today ...
, y no me anda. y buscando por la web no soy el primero que le pasa esto con google chrome.
por ahora buscare una funcion parecida a load(). si conoceis alguna que funcione en google chrome hacedmela saber por favor.gracias por comentar.salu2.
Cita de: jhonatanAsm en 9 Diciembre 2011, 13:04 PM
@efex, ya le puse:
<li><a href="http://127.0.0.1/today.html">Today ...
, y no me anda. y buscando por la web no soy el primero que le pasa esto con google chrome.
por ahora buscare una funcion parecida a load(). si conoceis alguna que funcione en google chrome hacedmela saber por favor.gracias por comentar.salu2.
Ve los errores javascript en chrome, debe haber algo incompatible con él.
Muestranos el error y te daremos las posibles soluciones
Cita de: jhonatanAsm en 9 Diciembre 2011, 13:04 PM
@efex, ya le puse:
<li><a href="http://127.0.0.1/today.html">Today ...
, y no me anda. y buscando por la web no soy el primero que le pasa esto con google chrome.
por ahora buscare una funcion parecida a load(). si conoceis alguna que funcione en google chrome hacedmela saber por favor.gracias por comentar.salu2.
load() funciona perfectamente en chrome, yo estoy haciendo ahora mismo un proyecto que lleva ajax y estoy usando la función load() de jquery y funciona sin problemas en todos los navegadores. Así que el error no puede ser la función load, será otra parte del script.
Cita de: Spider-Net en 9 Diciembre 2011, 14:27 PM
load() funciona perfectamente en chrome, yo estoy haciendo ahora mismo un proyecto que lleva ajax y estoy usando la función load() de jquery y funciona sin problemas en todos los navegadores. Así que el error no puede ser la función load, será otra parte del script.
Exacto, por eso nos debe mostrar el error javascript que le aparece, porque tambien uso la funcion load en chrome y ningun problema.
Hola jhona, lo probé con chrome y no tube problemas :-\ (instale la ultima version, por que hace poco formatie), anda a la consola de javascript que tiene chrome para tratar de identificar el problema, para abrir la consola es SHIFT+CTRL+J, el panel de abajo es la consola y te saldrá donde esta el error marcado en rojo.
Por las dudas dejo el codigo.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Quis Nostrud</title>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<style type="text/css">
p{
background-color:#FFFBDB;
padding:5px;
}
</style>
<script type="text/javascript">
$(document).ready(function(){
$('#links a').click(function() {
var url=$(this).attr('href');
$('#headlines').load(url + ' #newsItems');
return false;
});
});
</script>
</head>
<body id="threeCol">
<div id="container">
<div id="banner">
<img src="../images/banner.png" alt="javascript: The Missing Manual" width="760" height="65">
<span id="badge">
<a href="http://www.sawmac.com/missing/js/"></a>
</span>
</div>
<div id="contentWrap">
<div id="main">
<h1>Using jQuery’s load() Function</h1>
<h2>Headlines</h2>
<ul id="links">
<li><a href="archivo.html">Today’s News</a></li>
<li><a href="yesterday.html">Yesterday’s News</a></li>
<li><a href="lastweek.html">Last Week’s News</a></li>
</ul>
</div>
<div id="sidebar">
<h2>Script 11.1</h2>
</div>
</div>
<div id="news">
<h2>News Headlines</h2>
<div id="headlines"></div>
</div>
<div id="footer">
<em>“Building Interactive Web Sites with javascript”</em>
</div>
</div>
</body>
</html>
hola, aparentemente es cuestion de permisos. me tira el sgte error:
XMLHttpRequest cannot load file:///C:/Users/nombreUsuario/Desktop/abc.html. Origin null is not allowed by Access-Control-Allow-Origin.
como puedo solucionarlo.gracias por su ayuda.salu2.
Cita de: jhonatanAsm en 10 Diciembre 2011, 14:31 PM
hola, aparentemente es cuestion de permisos. me tira el sgte error:
XMLHttpRequest cannot load file:///C:/Users/nombreUsuario/Desktop/abc.html. Origin null is not allowed by Access-Control-Allow-Origin.
como puedo solucionarlo.gracias por su ayuda.salu2.
Subelo a un server, que a mi me paso lo mismo, y se resolvio de esa manera :xD
me funciono cuando lo puse en el server. existe alguna explicacion (lógica )para esto? , que significa Access-Control-Allow-Origin?
@Spider-Net, tu proyecto lo trabajas desde un server?
gracias... totales. ;-)
pd: acabo de conocer lo que es yql y me llama la atencion: http://james.padolsey.com/javascript/cross-domain-requests-with-jquery/
aquí un tuto: http://blog.ikhuerta.com/tutorial-de-yql-con-jquery
ahora. les parece un lenguaje de programacion para internet... :xD
Cita de: jhonatanAsm en 11 Diciembre 2011, 20:51 PM
no se podrán cambiar los permisos en la carpeta donde se instaló el google chrome?
algo así como configurar el php.ini
salu2.
Si lo subes a un servidor o lo usas con apache en localhost TE FUNCIONARÁ.
Cita de: DonVidela en 7 Diciembre 2011, 20:59 PM
Referenciaste primero la libreria de jquery :xD ?
gracias jajajajaj q noob q soy arranque con php, html, y javascript hace muy poco