Image swap ne fonctionnera pas dans Firefox, mais fonctionne dans Chrome et IE

Je suis en train d'échanger deux images dans deux divs sur l'événement click, de sorte que 22a.jpg se termine par div # second et 22b.jpg finit dans div # premier, mais chaque fois que je clique sur le bouton "swap", je reçois cette erreur dans Firebug: imgArray [2] .src est indéfini. J'ai essayé d'exécuter le code dans Chrome 17.0.963.2 et IE 8.0, et cela fonctionne très bien sans erreurs. J'utilise Firefox 11.0Image swap ne fonctionnera pas dans Firefox, mais fonctionne dans Chrome et IE

HTML

<body> 
    <div id = "first" class = "thumbnail"> 
     <img class = "thumbsize" src = "22a.jpg" /> 
    </div> 
    <div id = "second" class = "thumbnail"> 
     <img class = "thumbsize" src = "22b.jpg" /> 
    </div> 
    <input type = "button" id = "swap" value = "swap" /> 
</body>

<script type = "text/javascript"> 
    document.getElementById("swap").onclick = function(){ 
     if(document.images){ 
      var imgArray = document.images; 
      imgArray[2] = new Image(); 
      imgArray[2].src = imgArray[0].src; 
      imgArray[0].src = imgArray[1].src; 
      imgArray[1].src = imgArray[2].src; 
     } 
    }; 
</script>

Source

2012-05-12 Tifa

document.images est en lecture seule dans Firefox (link to specification). Vous pouvez créer une nouvelle image, mais vous ne pouvez pas l'ajouter au tableau document.images.

Une meilleure façon d'y parvenir swapping d'image ressemblerait à quelque chose comme ceci:

document.getElementById("swap").onclick = function(){ 
    if(document.images){ 
     var imgArray = document.images; 
     var tempSrc = imgArray[0].src; 
     imgArray[0].src = imgArray[1].src; 
     imgArray[1].src = tempSrc; 
    } 
};

Source

2012-05-12 23:01:05 mgiuffrida

Merci pour l'illumination et le code fonctionne comme un charme. – Tifa

Avez-vous essayé de le mettre dans une sorte de ready -fonction?

Source

2012-05-12 22:50:03

Pas encore. Donne-moi un min et je te rappellerai au plus vite – Tifa

Ca ne marche pas – Tifa

ok, tu pourrais essayer d'enregistrer le src dans une variable, au lieu de créer une nouvelle image. Juste pour vous donner une idée de ce qu'il faut essayer ensuite. –

Vous n'avez que deux images dans votre code HTML, donc imgArray [2] n'est pas défini. Utilisez une variable temp pour permuter les autres images.

Source

2012-05-12 23:00:32 dragon66

$('button#swap').toggle(function() { 
$("div#first > img").attr('src','22b.jpg'); 
$("div#second > img").attr('src','22a.jpg'); 
}, function() { 
$("div#first > img").attr('src','22a.jpg'); 
$("div#second > img").attr('src','22b.jpg'); 
});

Would quelque chose comme ce travail pour vous?

Source

2012-05-12 23:13:55 Bill

Image swap ne fonctionnera pas dans Firefox, mais fonctionne dans Chrome et IE

Répondre

Questions connexes