Uncaught TypeError: Impossible de définir la propriété « src » undefined

Question

J'ai le code javascript suivant, qui est en train de faire une rotation de l'image sur un site web je travaille. Il fonctionne correctement dans Firefox, mais pas dans Chrome ou Safari.

Quand je lance la console de script dans Firebug, il ne trouve pas une erreur, mais quand je lance la console de script dans Chrome, il revient avec l'erreur: Uncaught TypeError: Impossible de définir la propriété « src » undefined

l'erreur est à Line38, à proximité du fond, le document [lieu] .src = new_image ();

Je suis nouveau javascript compréhension, bien que je l'ai utilisé plusieurs scripts pour un certain temps. Je voudrais savoir ce qu'il se passe des thats causant le script de ne pas travailler, et ce que je pouvais faire pour le faire fonctionner.

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 Uncaught TypeError: Can propriété non réglé 'src' undefined

Merci pour votre aide.

Answer 1

Votre code peut être tellement plus simple. voir en action.

Utilisation comme: 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);
}

Answer 2

Je semble que vous devriez être en mesure de changer le document[place].src à document.getElementById(place).src puis passer juste à l'ID de l'élément et cela devrait fonctionner.

Je ne l'ai pas vu à l'aide de l'objet de document comme un tableau avant, mais il est standard d'utiliser la méthode getElementById qui trouvera l'élément DOM avec l'identifiant que vous lui donnez. le reste de votre code Une fois que vous avez l'objet DOM correct devrait fonctionner.

Answer 3

Qu'est-ce que vous essayez de définir exactement dans la ligne document[place].src = new_image;? On dirait que vous êtes en train d'essayer de définir une propriété d'un élément HTML (une image dans ce cas). Pour ce faire, vous devriez utiliser document.getElementById("element_id").

À l'heure actuelle, voici ce qui se passe: en JavaScript, notation de type tableau notation par points se traduit, donc document[place] fait référence à une propriété de document dont le nom figure dans le place variable. Par exemple, si place est "hello", alors document[place] est le même que document.hello, qui est juste une propriété de l'objet document - il est juste une simple variable à laquelle vous pouvez tout attribuer que vous voulez - mais il ne fait pas partie du DOM.