Question

我在页面上有缩略图，如下：

<div id="credits">
<a href="largeimage1.jpg" alt="credits1.php"><img src="thumb1"></a>
<a href="largeimage2.jpg" alt="credits2.php"><img src="thumb2"></a>
<a href="largeimage3.jpg" alt="credits3.php"><img src="thumb3"></a>
</div>

<div id="zoom"></div>

<div id="credits"></div>

我希望做到以下几点：

用户点击thumb1＆gt; largeimage1加载#zoom和credits1.php加载#credits
用户点击thumb2＆gt; largeimage2加载#zoom和credits2.php加载#credits
等

这可以用jquery吗？即。是否可以在同一页面上进行TWO（2）ajax调用，如上所述，只需单击一次？

我目前有以下代码用于LARGE图像ajax调用：

<script type="text/javascript">
$(document).ready(function(){
    $("a").click(function(){
        var largePath = $(this).attr("href");
        $("#zoom img").fadeOut("slow", function() {
                $(this).attr({ src: largePath }).fadeIn("slow");
        });
        return false;
    });
});
</script>

它就像一个魅力 - 但我现在有一种情况，我想加载另一个div中的图像的信用。

非常感谢任何帮助。：）

Answer 1

在这一行之上：

return false;

添加：

$('#credits').load($(this).attr('alt'));

异步请求的重点在于，您可以在继续前进的同时触发任意数量的请求。您可能希望使用某种加载指示器，当您使用加载时发生某些事情，以及可能会出现一些错误处理，但上述情况应该在基本级别上完成。

Answer 2

伙计，那不是ajax。它只是通过编辑css display：block;来隐藏页面上的元素。显示：无;

Answer 3

为了确保我没有遗漏关于jquery的东西（我对mootools更熟悉），除非你的缩放div中已有图像，否则你的第一段代码将无效。我没有在代码中看到任何将新图像注入div的内容......它只针对现有图像并更新其属性。或者我错过了什么？

一个页面上有Jquery和多个AJAX调用

3 个答案: