jquery .load()不工作onclick
我想建立一个网站,所以当页面加载时有一个div,动态地从我设置的.html页面中提取它的内容。在顶部有一堆缩略图,当你点击一个时,我希望来自不同的.html文档的内容替换第一次动态加载的每个div。jquery .load()不工作onclick
为此,我试图使用jquery .load()功能。我试图做的是建立一个功能:
<script type="text/javascript">
$(document).ready(function space_load() {
$('#SPACE_TOTAL').load('http://www.klossal.com/portfolio/space.html');
}
</script>
,然后试图用启动它:
onclick="space_load();"
这个没有工作,我想知道是否有人能帮助我。我想知道的另一件事是,如果这是行得通的,它会替换之前加载到那里的内容吗?我可能会得到自己的头,它只是自己做。
首先,你的代码具有无效结构
$(document).ready(function() {
function space_load() {
$('#SPACE_TOTAL').load('http://www.klossal.com/portfolio/space.html');
}
space_load(); //Now call the function
});
但是,您可以修剪下来做这个
$(function() {
$('#SPACE_TOTAL').load('http://www.klossal.com/portfolio/space.html');
});
但是,既然你想这对元素的点击。 这是你所需要的:
$(function() {
$("#yourlinkid").click(function() {
$('#SPACE_TOTAL')
.html('<img src="preloader.gif" />')
.load('http://www.klossal.com/portfolio/space.html');
});
});
您是否需要在此处使用document.ready?我想你可以简单地在点击发生时调用该函数。
<script type="text/javascript">
function space_load() {
$('#SPACE_TOTAL').load('http://www.klossal.com/portfolio/space.html');
}
</script>
然后......
onclick="space_load();"
会假设#SPACE_TOTAL
不是被动态填充在运行时,此时你需要包装一个document.ready
的容器。
时显示保证完全准备好DOM的联系? – AndreKR 2012-03-26 12:30:07
是的,我同意,但继续发布的内容没有规定这是事实。 – SpaceBison 2012-03-26 12:30:49
我曾经想过使用它,#SPACE_TOTAL是网址加载到的div?实际上我没有想过装载部分,好点。 – loriensleafs 2012-03-26 12:44:21
起初,您不需要$(document).ready()
;第二,您忘记关闭ready()
方法。在JS的结尾处缺少);
。
它被提及的早,我没有想到这一点,但有没有办法给它一个负载.gif,当它完成加载时消失? – loriensleafs 2012-03-26 12:52:06
@loriensleafs,检查我最后一个代码块中的更新。 – Starx 2012-03-26 12:54:02
它完成加载后就会消失? – loriensleafs 2012-03-26 13:02:05