多个 JavaScript 按钮（变量）
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/10116594/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Multiple JavaScript Buttons (Variables)
提问by
I'm just beginning JavaScript, and I was wondering how to make different buttons do different things. So far, I can make one button do one thing, but how do I make a second button do a different thing? Here's the coding:
我刚刚开始使用 JavaScript，我想知道如何让不同的按钮做不同的事情。到目前为止，我可以让一个按钮做一件事，但如何让第二个按钮做不同的事情？这是编码：
<html>
<head>
<script type="text/javascript">
function show_prompt()
{
var name=prompt("Your Name");
if (name!=null && name!="")
{
alert("Thanks for clicking " + name + "!");
window.top.location.replace("http://www.google.com");
}
}
</script>
</head>
<body>
<ul>
<li>
<input type="button" onclick="show_prompt()" value="Button One" />
</ul>
</body>
</html>
采纳答案by Daniel J. Pritchett
Define another function and bind the second button to it!
定义另一个函数并将第二个按钮绑定到它！
function alert_hi() {
alert("Hi!");
}
<input type="button" onclick="alert_hi()" value="Button Two" />
If that catches your interest I highly recommend Eloquent Javascript.
如果这引起了您的兴趣，我强烈推荐Eloquent Javascript。
回答by ajax333221
I will guess you meant like doing different things with different buttons but from the same function:
我猜你的意思是用不同的按钮做不同的事情，但使用相同的功能：
JavaScript:
JavaScript：
function myFunction(str) {
if(str.length > 3){
alert("big");
}else{
alert("small");
}
}
HTML:
HTML：
<input type="button" onclick="myFunction('test');" value="Button 1" />
<input type="button" onclick="myFunction('hi');" value="Button 2" />
In case my assumption is wrong, just create different functions and replace the button's onclickwith their respective function
如果我的假设是错误的，只需创建不同的功能并将按钮替换为onclick各自的功能
回答by ahruss
Making the second button do something is basically identical to making the first do something. It'd just be two functions and two buttons. I think this is what you're asking about.
让第二个按钮做某事与让第一个按钮做某事基本相同。它只是两个功能和两个按钮。我想这就是你要问的。
<html>
<head>
<script type="text/javascript">
function doSomething()
{
// Do something when button one is clicked
}
function doSomethingElse()
{
// Do something else when button two is clicked
}
</script>
</head>
<body>
<input type="button" onclick="doSomething()" value="Button One" />
<input type="button" onclick="doSomethingElse()" value="Button Two" />
</body>
</html>
回答by rlemon
If you're serious about learning.. you can read up about Event Registration models.
如果您认真学习……您可以阅读有关事件注册模型的信息。
in the case of your example.
就你的例子而言。
js
js
var btn1 = document.getElementById('btn1'),
btn2 = document.getElementById('btn2');
btn1.addEventListener('click', show_me, false); // i am not IE friendly
btn2.addEventListener('click', show_me, false); // you can replace show_me with any function you would like.
function show_me() {
alert(this.value + ' was clicked'); // this references the element which the click event was invoked on.
}
html
html
<input type="button" id="btn1" value="Button One" />
<input type="button" id="btn2" value="Button Two" />
