버튼을 클릭 할 때 JavaScript 주사위 굴림

Question

버튼을 클릭 할 때 1에서 6 사이의 임의의 숫자가 표시되는 Javascript로 간단한 주사위 롤러를 만들려고합니다.

function diceRoll(min, max) { 
    var min = Math.ceil(min); 
    var max = Math.floor(max); 
    var roll = Math.floor(Math.random() * (max - min + 1)) + min; 
    console.log(roll); 
} 

document.getElementById("roll").onclick = diceRoll(1, 6); 

난수는 페이지가 처음로드 될 때 표시되지만 버튼 아무것도 클릭하지 않을 때 발생 :이 스크립트

<button id="roll">Click to Roll</button> 

:

이 나는 ​​버튼이 있습니다. 페이지를로드 할 때가 아니라 버튼을 클릭하면 어떻게 작동합니까? 고맙습니다.

Answer 1

사용이 대신 :

document.getElementById("roll").onclick = function() { 
    diceRoll(1, 6); 
}; 

현재 코드 문제는 그 라인이 실행될 때, diceRoll(1, 6)이 실행되고, 그 함수를 호출의 결과가 onclick 처리기에 할당된다는 점이다.

단추를 클릭 할 때마다 호출 할 수있는 함수 대신 onclick 처리기가 필요합니다. 위의 코드에서 호출 할 때 차례로 diceRoll(1, 6)을 호출하는 새로운 함수를 작성했습니다.

도움이된다면

,이 코드는 당신이 지금 무슨 일을하는지에 해당 (희망이 잘못된 이유 계시) :

// Call diceRoll and store its result (which is undefined, since 
// the function returns nothing). 
var result = diceRoll(1, 6); 

// Now take that result (undefined) and assign it to the button's 
// onclick handler. This makes onclick undefined too. 
document.getElementById("roll").onclick = result;