Question

我的文件中有这个：

<ul id="slideshow">
<li><img src="img1.jpg"></li>
<li><img src="img2.jpg"></li>
<li><img src="img3.jpg"></li>
</ul>

<ul id="thumbs">
<li><img src="img1_thumb.jpg"></li>
<li><img src="img2_thumb.jpg"></li>
<li><img src="img3_thumb.jpg"></li>
</ul>

如何使用jquery更改de load订单？

我需要先加载#thumbs。然后加载#slideshow。

目前，在慢速连接时，所有幻灯片图像加载后都会调用所有图像大拇指......

由于

[]的

马特乌斯

Answer 1

使用预加载。

$.preloadImages = function(){
  for(var i = 0; i<arguments.length; i++){
    jQuery("<img />", {style:'display:none'}).attr("src", arguments[i]);
  }
}

$.preloadImages("img2_thumb.jpg", "img1_thumb.jpg", "img3_thumb.jpg");

在实际幻灯片放映之前

Answer 2

您需要编写一个脚本，在页面加载/准备好后，为src中的图像分配#slideshow。

首先，在img中的每个#slideshow标记上设置ID，例如slideshow1，slideshow2和slideshow3。

然后在页面底部添加一个jquery加载<script>标记和此脚本：

$(function() {
 $("#slideshow1").attr("src","img1.jpg");
 $("#slideshow2").attr("src","img2.jpg");
 $("#slideshow3").attr("src","img3.jpg");
});

Answer 3

jQuery加载不知道所请求文件的内容是什么。因此，您应该手动更改文件中图像的顺序，或者将它们分成两个不同的文件并分别加载每个文件。

但是，从我看到的情况来看，我猜您正在尝试为图片库加载图片。

我建议使用TN3 gallery。

您加载图像的原因是浏览器会立即发送HTTP请求以获取新加载文档的必需项目，以便它可以呈现它。因此，当浏览器解密您的HTML时，它首先会看到<img src="img1.jpg">并尝试首先加载它。

但是，使用TN3图库时，您的HTML标记会被更改，您将提供完整图像的URL作为属性，并且您欺骗浏览器，因为它不会发送对该属性的请求。

Jquery加载顺序

3 个答案: