für() {} und setInterval() funktioniert nicht

Question

Ich möchte Bild 5s ändern nächstes Bild, aber ich kann das nicht funktionieren.

<div class="g-carousel" id="m-carousel"> 
    <a href="http://open.163.com/" class="pciture" target="_blank"><img src="imag/banner1.jpg" ></a> 
    <a href="http://study.163.com/" class="pciture two" target="_blank" style="display:none"><img src="imag/banner2.jpg" ></a> 
    <a href="http://www.icourse163.org/" class="pciture three" target="_blank" style="display:none"><img src="imag/banner3.jpg" ></a> 
    <div class="button"> 
     <i class="checked"></i><i></i><i></i> 
    </div> 
</div> 
<script type="text/javascript"> 
    function showpic() { 
     var carousel = document.getElementById("m-carousel") 
     var pciture = carousel.getElementsByClassName("pciture"); 
       for (var i=0 ; i < pciture.length; i++) 
        if (i>2) i=0; 
       pciture[i].style.display="none"; 
       pciture[i+1].style.display="block"; 

     } 
     window.onload=function function_name(argument) { 
      setInterval("showpic()",5000); 
     } 
</script> 

Answer 1

Arbeits jsfiddle

function showpic() { 

     var carousel = document.getElementById("m-carousel"); 
     var carouselLength = carousel.getElementsByTagName("a").length; 
     var pciture = carousel.getElementsByClassName("pciture"); 

     if (i>=carouselLength-1){ 
       pciture[i].style.display="none"; 
       i=0; 
       pciture[i].style.display="block"; 
       i--; 
     }else{ 
       pciture[i].style.display="none"; 
       pciture[i+1].style.display="block"; 
     } 
     i++;   
     } 
var i = 0; 
setInterval(showpic,2000); 

Answer 2

Vielleicht wäre es, wenn Sie

window.onload=function function_name(argument) { 

zu

window.onload=function(argument) { 

Hoffnung ändern helfen, das hilft.

Grüße

P.S. Live long and prosper :-)

Answer 3

Sie benötigen einen globalen Zähler haben:

var counter = 0; 

function showpic() { 
    var carousel = document.getElementById("m-carousel") 
    var pciture = carousel.getElementsByClassName("pciture"); 

    // Hide all the pictures. 
    for (var i=0 ; i < pciture.length; i++) 
    { 
     pciture[i].style.display="none"; 
    } 

    // Show the picture based on the counter. 
    pciture[counter].style.display="block"; 

    // Increment the counter ready for next time. 
    counter++; 

    // Check if the counter needs to loop back. 
    if(counter >= pciture.length) 
     counter = 0; 
} 

window.onload = function() { 
    setInterval(showpic, 5000); 
} 

Here is a working example