[英]How do you pass a button click as a function argument?
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Coin Flip</title>
</head>
<body>
<h1>Coin Flip</h1>
<h3>Let's flip a coin! Choose heads or tails:</h3>
<button onclick="flip()" id="choice">Heads</button>
<button onclick="flip()" id="choice">Tails</button>
<h3 id="guess"></h3>
<h3 id="result"></h3>
<h3 id="confirm"></h3>
</body>
<script src="scripts.js"></script>
</html>
function flip(choice) {
// Declares random number variable
var randomNumber=Math.floor(Math.random()*2)+1;
// Conditional random win/loss
if(randomNumber==1){
document.getElementById("guess").innerHTML = "You guessed " + choice + "...";
document.getElementById("result").innerHTML = "The coin flips and comes up Tails!";
document.getElementById("confirm").innerHTML = "Good Guess!";
}
else {
document.getElementById("guess").innerHTML = "You guessed " + choice + "...";
document.getElementById("result").innerHTML = "The coin flips and comes up Heads!";
document.getElementById("confirm").innerHTML = "Good Guess!";
}
}
我正在使用 HTML 和 JS 制作一个简单的掷硬币游戏。 我无法打印用户做出的选择（正面或反面）。 有没有办法将他们单击的按钮作为文本“heads”或文本“tails”传递？ 检查 JS 是否有将打印出来的文本。
只需在函数调用中将正面或反面作为参数传递：
<button onclick="flip('Heads')" id="choice">Heads</button>
<button onclick="flip('Tails')" id="choice">Tails</button>
function flip(choice) { // Declares random number variable var randomNumber=Math.floor(Math.random()*2)+1; // Conditional random win/loss if(randomNumber==1){ document.getElementById("guess").innerHTML = "You guessed " + choice + "..."; document.getElementById("result").innerHTML = "The coin flips and comes up Tails!"; document.getElementById("confirm").innerHTML = "Good Guess!"; } else { document.getElementById("guess").innerHTML = "You guessed " + choice + "..."; document.getElementById("result").innerHTML = "The coin flips and comes up Heads!"; document.getElementById("confirm").innerHTML = "Good Guess!"; } }
<html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Coin Flip</title> </head> <body> <h1>Coin Flip</h1> <h3>Let's flip a coin! Choose heads or tails:</h3> <button onclick="flip('Heads')" id="choice">Heads</button> <button onclick="flip('Tails')" id="choice">Tails</button> <h3 id="guess"></h3> <h3 id="result"></h3> <h3 id="confirm"></h3> </body> <script src="scripts.js"></script> </html>
不要重复ID。 有关详细信息，请参阅示例中的注释。
// Bind click event to each <button> document.querySelectorAll('button').forEach(btn => btn.onclick = flip); // Define event handler -- pass Event Object function flip(e) { // Reference the <button> user clicked const picked = e.target; // Get the value of picked and convert string to number with '+' let side = +picked.value; // Get random integer in the range of 1 to 2 let outcome = Math.floor(Math.random()*2)+1; // Reference <output> const out = document.querySelector('output'); // If the value of picked equals the random number... if (side === outcome) { // Assign winning string with picked id interpolated out.value = `${picked.id}! You win!`; } else { // Otherwise assign losing string to <output> out.value = `${picked.id}! You lose!`; } }
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Coin Flip</title> </head> <body> <h1>Coin Flip</h1> <p>Let's flip a coin! Choose heads or tails:</p> <button id='Heads' value='1'>Heads</button> <button id='Tails' value='2'>Tails</button> <p><output></output></p> </body> <script src="scripts.js"></script> </html>
如何将参数传递给引导程序弹出窗口内容内的按钮单击函数？
[英]How to pass an argument to a button click function inside bootstrap popover content?
在CoffeeScript中，如何将函数作为函数的参数传递，而函数又需要一个参数？
[英]In CoffeeScript, how do you pass a function as an argument of a function, which also in turn takes an argument?
您如何使用 HTML 按钮单击来调用 javascript function？
[英]How do you call a javascript function with a HTML button click?
您如何将javascript变量作为参数传递给vbscript函数（在HTA中）？
[英]How do you pass a javascript variable as an argument to a vbscript function (in the context of HTAs)?
如何获取 HTML 输入并将其作为参数传递给 JavaScript function？
[英]How can you take an HTML input and pass that as an argument into a JavaScript function?
如何在Telerik的RadListBox OnClientSelectedIndexChanged事件中传递参数？
[英]How do you pass an argument in Telerik's RadListBox OnClientSelectedIndexChanged event?
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.