javascript - 未捕获的类型错误 : Cannot set property 'src' of undefined

Question

我有以下 javascript 代码，它在我正在处理的网站上进行图像旋转。它在 Firefox 中正常工作，但在 Chrome 或 Safari 中不正常。

当我在 firebug 中运行脚本控制台时，它没有发现错误，但是当我在 Chrome 中运行脚本控制台时，它返回错误:Uncaught TypeError: Cannot set property 'src' of undefined

错误在第 38 行，靠近底部，document[place].src = new_image();

虽然我已经使用各种脚本很长时间了，但我对 javascript 还很陌生。我想知道导致脚本无法运行的原因，以及我可以做些什么来使其运行。

var interval = 5; // delay between rotating images (in seconds)  
var random_display = 0; // 0 = no, 1 = yes  
interval *= 1000;  

var image_index = 0;  
image_list = new Array();  
image_list[image_index++] = new imageItem("images/banner/banner-1.jpg");  
image_list[image_index++] = new imageItem("images/banner/banner-1.jpg");  
image_list[image_index++] = new imageItem("images/banner/banner-2.jpg");  
image_list[image_index++] = new imageItem("images/banner/banner-3.jpg");  
image_list[image_index++] = new imageItem("images/banner/banner-4.jpg");  
image_list[image_index++] = new imageItem("images/banner/banner-5.jpg");  
image_list[image_index++] = new imageItem("images/banner/banner-6.jpg");  
var number_of_image = image_list.length;  
function imageItem(image_location) {  
this.image_item = new Image();  
this.image_item.src = image_location;  
}  
function get_ImageItemLocation(imageObj) {
return(imageObj.image_item.src)
}
function generate(x, y) {  
var range = y - x + 1;  
return Math.floor(Math.random() * range) + x;  
}  
function getNextImage() {  
if (random_display) {  
image_index = generate(0, number_of_image-1);  
}  
else {  
image_index = (image_index+1) % number_of_image;  
}  
var new_image = get_ImageItemLocation(image_list[image_index]);  
return(new_image);  
}  
function rotateImage(place) {  
var new_image = getNextImage();  
document[place].src = new_image;  
var recur_call = "rotateImage('"+place+"')";  
setTimeout(recur_call, interval);  
}  

/scripts/animation.js:38 未捕获类型错误:无法设置未定义的属性“src”

感谢您的帮助。

Answer 1

您的代码可以简单得多。 See it in action.

像这样使用:rotateImage("imageid");

var interval = 5; // delay between rotating images (in seconds)  
var random_display = 0; // 0 = no, 1 = yes  
interval *= 1000;

var image_list = [ 
  "images/banner/banner-1.jpg", "images/banner/banner-1.jpg", 
  "images/banner/banner-2.jpg", "images/banner/banner-3.jpg", 
  "images/banner/banner-4.jpg", "images/banner/banner-5.jpg", 
  "images/banner/banner-6.jpg"
];

var image_index     = image_list.length;
var number_of_image = image_list.length;

function generate(x, y) {
    var range = y - x + 1;
    return Math.floor(Math.random() * range) + x;
}

function getNextImage() {
    if (random_display) {
        image_index = generate(0, number_of_image - 1);
    }
    else {
        image_index = (image_index + 1) % number_of_image;
    }
    return image_list[image_index];
}

function rotateImage(place) {
    document.getElementById(place).src = getNextImage();
    setTimeout(function() {
        rotateImage(place);
    }, interval);
}