JavaScript를 클릭 한 후 SetInterval()이 작동하지 않습니다.

Question

안녕하세요.이 코드를 작성했으며 객체를 클릭 한 후 3000 밀리 초마다 개체를 이동한다고 가정합니다. 그러나 시간이 어떻게 작동하지 않는지, 아무도 내가 무엇을 말 할 수 있습니까? 잘못하고, 나는 다만 자바 스크립트를 배우고있다; 대단히 감사합니다.

function move1() { 
    var im1 = document.images[0]; 
    im1.onclick = function() { 
     im1.style.left = parseInt(im1.style.left) + 1 + "px"; 
    } 
} 

function move2() { 
    var im2 = document.images[1]; 
    im2.onclick = function() { 
     im2.style.left = parseInt(im2.style.left) + 10 + "px"; 
    } 
} 

window.onload = function() { 
    setInterval(move1, 100); 
    setInterval(move2, 3000); 
} 

Answer 1

당신은 다른 방향으로하고 있습니다. 3000ms마다 클릭하면 이미지를 1px 이동시킬 수 있습니다.

function move(el, ms, px) { 
/* moves the el every ms by px 
returns the interval id to clear the movement */ 
    return setInterval(function() { 
     el.style.left = parseInt(el.style.left) + px + "px"; 
    }, ms); 
} 
window.onload = function() { 
    var im0 = document.images[0]; 
    var im1 = document.images[1]; 
    im0.onclick = function() { 
     move(im0, 100, 1); 
    }; 
    im1.onclick = function() { 
     move(im1, 3000, 10); 
    }; 
} 

Answer 2

이동 기능은 클릭 할 때 이미지를 등록하지만 사용자가 클릭 할 때까지 실제로 움직이지는 않습니다. 당신이 원하는 것은 다음과 같습니다.

function move1() { 
    var im1 = document.images[0]; 
    im1.style.left = parseInt(im1.style.left) + 1 + "px"; 
} 

function move2() { 
    var im2 = document.images[1]; 
    im2.style.left = parseInt(im2.style.left) + 10 + "px"; 
} 

window.onload = function() { 
    var im2 = document.images[1]; 
    im2.onclick = function() { 
     setInterval(move2, 3000); 
    } 

    im1.onclick = function() { 
     setInterval(move1, 100); 
    } 
}