我不明白为什么当我点击前进按钮时,一切正常。但当我把这两个按钮混合在一起时,第一个数字是随机的,我想。
<body>
<button id="back"> < </button>
<img name="name" width="400px"; height="500px;">
<button id="forward"> ></button>
<script>
var i = 0; //starting point
var images = ["image1.png", "image2.png", "image3.png"];
var forward = document.getElementById("forward");
var back = document.getElementById("back");
function next(){
document.name.src = images[i];
if(i < images.length - 1){
i++;
}else i = 0;
}
function before(){
document.name.src = images[i];
if(i == 0){
i = images.length-1;
} else{
i--;
}
}
forward.onclick = function(){ next()};
back.onclick = function(){before()};
</script>
</body>
你正在分配新的值 之前 变化 i
.
按照你现在的逻辑,如果你一开始按>就会显示图像0,并将计数器设为1,那么不管你按哪个按钮,它都会先显示图像1再改值。
你需要事后再进行分配。
你把 document.name.src = images[i];
计算指数之前。你可能想做的是 之后. 这种方式的图片反映了你的 以前 点击按钮而不是当前的按钮。