所以我有以下HTML:
<ul id="nav">
<li><a href="somepage1.php" class="class1">Link1</a></li>
<li><a href="somepage2.php" class="class2">Link2</a></li>
</ul>
jQuery函数:
(function($) {
var imgList = [];
$.extend({
preload: function(imgArr, option) {
var setting = $.extend({
init: function(loaded, total) {},
loaded: function(img, loaded, total) {},
loaded_all: function(loaded, total) {}
}, option);
var total = imgArr.length;
var loaded = 0;
setting.init(0, total);
for(var i in imgArr) {
imgList.push($("<img />")
.attr("src", imgArr[i])
.load(function() {
loaded++;
setting.loaded(this, loaded, total);
if(loaded == total) {
setting.loaded_all(loaded, total);
}
})
);
}
}
});
})(jQuery);
和文档就绪触发器(简化):
$.preload([
'path/to/image.jpg',
'path/to/image2.jpg',
'path/to/image3.jpg',
'path/to/image4.jpg',
]);
它工作得很好,但我需要加强它。当用户单击类“class1”的锚点时,预加载器应读取分配给特定数组的图像。而且我只需要写一次'$.preload'。
所以我的想法是创建两个不同的数组,例如:
var arraysClass1 = [
'path/to/image.jpg',
'path/to/image2.jpg',
'path/to/image3.jpg',
'path/to/image4.jpg'
];
var arraysClass2 = [
'path/to/image5.jpg',
'path/to/image6.jpg',
'path/to/image7.jpg',
'path/to/image8.jpg'
];
然后创建如下所示的文档就绪事件。我被困在这里,下面的代码有错误
$('#nav a').live("click", (function(event){
event.preventDefault();
var getClass = '.'+$(this).attr("class");
$(function() {
$.preload([
if(getClass=='.class1'){
arrayClass1;
}
elseif(getClass=='.class2'){
arrayClass2;
}
]);
});
我不知道如何在 $.preload([...]); 中创建“IF”逻辑;