Question

我正在显示旋转图像。

var pics= [
    "images/img1.jpg",
    "images/img2.jpg",
    "images/img3.jpg",
];

并希望它停止onClick。

function StopRotate(interval, imgIndex) {
    clearInterval(interval);
    var permanentImage = picture[imgIndex].src;
    picture[imgIndex].src = permanentImage;
    pics.splice(pics.indexOf(picture[imgIndex].src), 1);
}

以下是旋转图像的方法（此块有三个图像容器出现三次）：

interval0 = setInterval(function () {
    if(pics.length != 1) {
        picture[0].src = pics[count];
        count++;
        if (count == pics.length) count = 0;
    }
    else picture[0].src = pics[0];
}, 10);

但即使路径已从阵列中移除，图像也会再次出现在其他帧中。我尝试使用12张图片。有时当我运行它时，src结果是未定义的。

此外，如果单击无序图像，其他帧中的图像将变为空白。在这个示例中，我有三个图像，如果我单击第三个容器，第一个容器变为空白，当间隔函数分开时，它如何影响其他帧。但是按顺序点击它没有问题。注意我已经改变了将if条件放在setInterval中的顺序。

Answer 1

.src属性将返回一个完全限定的路径名，当您尝试使用.indexOf()查找时，该路径名在您的部分路径名数组中永远不会找到。

您可以使用.getAttribute("src")获取HTML中的实际内容，然后该内容应与您在数组中的内容相匹配。

示例：http://jsfiddle.net/jfriend00/3H8XF/

如何使用拼接方法正确解决我的问题？

1 个答案: