按钮onclick事件不会在javascript中触发
[英]Button onclick event doesn't fire in javascript
问题描述
我不知道这段代码有什么问题。
有两个用于两个变量相加，相减，相乘和除法的输入字段和四个按钮（每个按钮分别用于相加，相减，相乘和除法），但是当我单击它们时，什么也没有发生。
<h1>Calculator</h1>
<input id="f1" />
<input id="f2" />
<button id="add">Add</button>
<button id="sub">Sub</button>
<button id="multi">Multi</button>
<button id="div">Div</button>
var f1, f2, result;
document.getElementById("add").onclick=function{
f1= document.getElementById("f1").value;
f2= document.getElementById("f2").value;
result = return f1+f2;
}
document.getElementById("sub").onclick=function{
f1= document.getElementById("f1").value;
f2= document.getElementById("f2").value;
result = return f1-f2;
}
document.getElementById("multi").onclick=function{
f1= document.getElementById("f1").value;
f2= document.getElementById("f2").value;
result = return f1*f2;
}
document.getElementById("div").onclick=function{
f1= document.getElementById("f1").value;
f2= document.getElementById("f2").value;
result = return f1/f2;
}
if(result!=null)
alert("Result = "+result);
4 个解决方案
解决方案1
2 已采纳 2014-10-20 04:31:32
您有一些错误和语法错误：
function需要()：onclick = function () {}在这种情况下，无需使用
return，只需将结果存储到变量中即可：result = f1+f2;您应该将文本框值转换为数字：
f1 = document.getElementById("f1").value * 1;您应该在每个
onclick显示结果，而不是在脚本末尾显示结果。
var f1, f2, result; document.getElementById("add").onclick=function(){ f1= document.getElementById("f1").value * 1; f2= document.getElementById("f2").value * 1; result = f1+f2; alert("Result = "+result); } document.getElementById("sub").onclick=function(){ f1= document.getElementById("f1").value * 1; f2= document.getElementById("f2").value * 1; result = f1-f2; alert("Result = "+result); } document.getElementById("multi").onclick=function(){ f1= document.getElementById("f1").value * 1; f2= document.getElementById("f2").value * 1; result = f1*f2; alert("Result = "+result); } document.getElementById("div").onclick=function(){ f1= document.getElementById("f1").value * 1; f2= document.getElementById("f2").value * 1; result = f1/f2; alert("Result = "+result); }
<h1>Calculator</h1> <input id="f1" /> <input id="f2" /> <button id="add">Add</button> <button id="sub">Sub</button> <button id="multi">Multi</button> <button id="div">Div</button>
解决方案2
0 2014-10-20 04:30:57
请在下面找到工作代码
var f1, f2, result;
document.getElementById("add").onclick=function(){
f1= document.getElementById("f1").value;
f2= document.getElementById("f2").value;
result = f1+f2;
if(result!=null)
alert("Result = "+result);
}
将值分配给变量的Inorde无需使用return关键字。 同样，当您分别在每个按钮中附加每个按钮的click事件时，您需要代码来显示结果。 希望您能找到并纠正上述其他功能。
解决方案3
0 2014-10-20 04:33:12
您的代码中有一些错误：
1-您正在返回价值，但永远不会使用它。
2-您的函数定义需要（）
3-yo应该将输入值转换为int
那么这对你有用
var f1, f2, result;
document.getElementById("add").onclick=function(){
f1= document.getElementById("f1").value;
f2= document.getElementById("f2").value;
result = parseInt(f1)+parseInt(f2);
if(result!=null)
alert("Result = "+result);
}
document.getElementById("sub").onclick=function(){
f1= document.getElementById("f1").value;
f2= document.getElementById("f2").value;
result = parseInt(f1)-parseInt(f2);
if(result!=null)
alert("Result = "+result);
}
document.getElementById("multi").onclick=function(){
f1= document.getElementById("f1").value;
f2= document.getElementById("f2").value;
result = parseInt(f1)*parseInt(f2);
if(result!=null)
alert("Result = "+result);
}
document.getElementById("div").onclick=function(){
f1= document.getElementById("f1").value;
f2= document.getElementById("f2").value;
result = parseInt(f1)/parseInt(f2);
if(result!=null)
alert("Result = "+result);
}
解决方案4
0 2014-10-20 04:36:39
<!doctype html>
<html>
<head>
<title>Javascript</title>
<meta charset="utf-8" />
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
</head>
<body>
<h1>Calculator</h1>
<input id="f1" />
<input id="f2" />
<button id="add">Add</button>
<button id="sub">Sub</button>
<button id="multi">Multi</button>
<button id="div">Div</button>
<script type="text/javascript">
var f1, f2, result;
document.getElementById("add").onclick = function () {
f1 = parseFloat(document.getElementById("f1").value);
f2 = parseFloat(document.getElementById("f2").value);
result = f1 + f2;
showResult();
}
document.getElementById("sub").onclick = function () {
f1 = parseFloat(document.getElementById("f1").value);
f2 = parseFloat(document.getElementById("f2").value);
result = f1 - f2;
showResult();
}
document.getElementById("multi").onclick = function () {
f1 = parseFloat(document.getElementById("f1").value);
f2 = parseFloat(document.getElementById("f2").value);
result = f1 * f2;
showResult();
}
document.getElementById("div").onclick = function () {
f1 = parseFloat(document.getElementById("f1").value);
f2 = parseFloat(document.getElementById("f2").value);
result = f1 / f2;
showResult();
}
function showResult() {
alert("Result = " + result);
}
</script>
</body>
</html>
<asp:Button>使用UseSubmitBhaviour = false时不会触发'onclick'事件
[英]<asp:Button> doesn't fire 'onclick' event with using UseSubmitBhaviour=false
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.