我在一个函数上有一个数组的数组(allArr),第一次从 allArr 的位置 0 开始的数组与来自另一个数组的位置 0 的图像一起使用图像(命名图像)'cause of document.ready 然后点击来自 allArr 的按钮 (id="nextimageandshuffle") 数组和来自图像数组的图像达到第五位。我的问题是,每次我单击下一个按钮时,我必须用 empty() 清除 div(id="array"),其中来自 allArr 的数组添加了 append() 但我无法在第 5 个数组之后停止它,因此第 5 个图像(来自图像数组)保留在那里但第 5 个数组(来自 allArr)被删除......
这是我的代码:
var allArr;
var contor = 0;
var i = 0;
$(document).ready( function() {
var arr = new Array("images/alfabet/w.png", "images/alfabet/f.png", "images/alfabet/v.png", "images/alfabet/a.png", "images/alfabet/b.png", "images/alfabet/p.png", "images/alfabet/o.png", "images/alfabet/r.png");
var baiat = new Array("images/alfabet/p.png", "images/alfabet/b.png", "images/alfabet/a.png", "images/alfabet/aa.png", "images/alfabet/i.png","images/alfabet/a.png", "images/alfabet/t.png");
var colac = new Array("images/alfabet/g.png", "images/alfabet/c.png", "images/alfabet/u.png", "images/alfabet/o.png", "images/alfabet/l.png", "images/alfabet/a.png", "images/alfabet/c.png");
var slapi = new Array("images/alfabet/s.png", "images/alfabet/ss.png", "images/alfabet/l.png", "images/alfabet/a.png", "images/alfabet/b.png", "images/alfabet/p.png", "images/alfabet/i.png", "images/alfabet/i.png");
var umbrela = new Array("images/alfabet/u.png", "images/alfabet/n.png", "images/alfabet/m.png", "images/alfabet/p.png", "images/alfabet/b.png", "images/alfabet/r.png", "images/alfabet/e.png", "images/alfabet/l.png", "images/alfabet/a.png");
allArr = new Array(arr, baiat, colac, slapi, umbrela);
for(i=0; i<allArr[0].length; i++)
{
var img = new Image();
img.src = allArr[0][i];
$('#array').append(img);
}
});
var image = new Array("images/baiat.png", "images/colac.png" , "images/slapi.png" , "images/umbrela.png");
var imgNumber=0;
var numberOfImg = image.length;
function nextImage(){
if(imgNumber < numberOfImg){
imgNumber++;
}
document.slideImage.src = image[imgNumber-1];
contor++;
$("#array").empty();
for(i = 0; i<allArr[contor].length; i++)
{
var img = new Image();
img.src = allArr[contor][i];
$('#array').append(img);
}
}
if(document.images){
var image1 = new Image();
image1.src = "images/vapor.png";
var image2 = new Image();
image2.src = "images/baiat.png";
var image3 = new Image();
image3.src = "images/colac.png";
var image4 = new Image();
image4.src = "images/slapi.png";
var image5 = new Image();
image5.src = "images/umbrela.png";
}
HTML:
<img src="images/vapor.png" name="slideImage" class='secondcanvas' width='450' height='300' alt="">
<div id="array" class='thirdcanvas'></div>
<a href="#" onClick="nextImage()"><img id="nextimageandshuffle" src="images/nextBtn.png" title="Continuare" ></a>
最佳答案
我不确定我是否完全理解你正在尝试做的事情,但我想我明白了......
你需要确定你是否在最后一张图片上,因为如果你不在,你仍然想清空该元素。将当前图像 src 与 allArr[4][4] 中的字符串进行比较,如果它们匹配,则不要执行 .empty()。所以不仅仅是:
$("#array").empty();
您需要将其替换为:
if(img.src == allArr[4][4]){
return;
}else{
$("#array").empty();
}
关于javascript - 如何结束 .empty(),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20613387/