从按钮点击功能
[英]onClick from button to function
问题描述
This is a work in progress (a calculator and some other stuff), but what I'm trying to do at the moment is whenever you type in some number into the results of the calculator, and you press "+" the onclick will call checkValidity which will determine if what you typed in was integer or not integer. 
这是一个正在进行中的工作（一个计算器和其他一些东西），但是我现在想做的是只要您在计算器的结果中输入一些数字，然后按“ +”，onclick就会调用checkValidity将确定您键入的内容是整数还是非整数。 It will send an alert saying integer or not an integer. 它将发送一个警告，说整数或非整数。 My issue is that the onclick won't do anything. 我的问题是onclick不会执行任何操作。 I tried emptying the checkValidity function of everything but alert("test); and it still won't work. Could someone please explain what I'm doing wrong? 我试过清空alert（“ test）之外的所有东西的checkValidity函数；它仍然无法正常工作。有人可以解释一下我在做什么错吗？
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript>">
function checkValidity()
{
var Calculator = document.getElementById("Calculator")
if (Calculator.Result.value === parseInt(test, 10))
{
alert("Integer!");
}
else
{
alert("Not an integer, press C");
}
}
</script>
<form name="Calculator">
First name:
<br>
<input type="text" name="firstname">
<br>
Last name:
<br>
<input type="text" name="lastname">
<br>
Student ID:
<br>
<input type="text" name="ID">
<br>
Biography:
<br>
<textarea maxlength=30 rows="2" cols="30">
</textarea>
<br>
Result:
<table border="1" style="width:100%">
<input type="text" name="Result" size="12">
<tr>
<td><Input type="button" Name="zero" Value="0" OnClick="Calculator.Result.value += '0'"> </td>
<td><Input type="button" Name="one" Value="1" OnClick="Calculator.Result.value += '1'"></td>
<td><Input type="button" Name="two" Value="2" OnClick="Calculator.Result.value += '2'"></td>
<td><Input type="button" Name="three" Value="3" OnClick="Calculator.Result.value += '3'"></td>
</tr>
<tr>
<td><Input type="button" Name="four" Value="4" OnClick="Calculator.Result.value += '4'"></td>
<td><Input type="button" Name="five" Value="5" OnClick="Calculator.Result.value += '5'"></td>
<td><Input type="button" Name="six" Value="6" OnClick="Calculator.Result.value += '6'"></td>
<td><Input type="button" Name="seven" Value="7" OnClick="Calculator.Result.value += '7'"></td>
</tr>
<tr>
<td><Input type="button" Name="eight" Value="8" OnClick="Calculator.Result.value += '8'"></td>
<td><Input type="button" Name="nine" Value="9" OnClick="Calculator.Result.value += '9'"></td>
<td><Input type="button" Name="plus" Value="+" OnClick="checkValidity()"></td>
<td><Input type="button" Name="minus" Value="-" OnClick="Calculator.Result.value += '-'"></td>
</tr>
<tr>
<td><Input type="button" Name="equals" Value="=" OnClick="Calculator.Result.value = eval(Calculator.Result.value)"></td>
<td><Input type="button" Name="divide" Value="/" OnClick="Calculator.Result.value += '/'"></td>
<td><Input type="button" Name="multiply" Value="*" OnClick="Calculator.Result.value += '*'"></td>
<td><Input type="button" Name="clear" Value="C" OnClick="Calculator.Result.value = ''"></td>
</tr>
</table>
<span id="HoursWorkedThisWeek"></span>
<Input type="button" Name="Save" Value="Save" OnClick="Calculator.HoursWorkedThisWeek = Calculator.Result.value">
<Input type="button" Name="Submit" Value="Submit">
</form>
</head>
</html>
2 个解决方案
解决方案1
0 已采纳 2015-03-16 04:14:03
try this it worked 试试这个工作
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<form id="Calculator" name="Calculator">
First name:
<br>
<input type="text" name="firstname">
<br>
Last name:
<br>
<input type="text" name="lastname">
<br>
Student ID:
<br>
<input type="text" name="ID">
<br>
Biography:
<br>
<textarea maxlength=30 rows="2" cols="30">
</textarea>
<br>
Result:
<table border="1" style="width:100%">
<input type="text" name="Result" size="12">
<tr>
<td><Input type="button" Name="zero" Value="0" OnClick="Calculator.Result.value += '0'"> </td>
<td><Input type="button" Name="one" Value="1" OnClick="Calculator.Result.value += '1'"></td>
<td><Input type="button" Name="two" Value="2" OnClick="Calculator.Result.value += '2'"></td>
<td><Input type="button" Name="three" Value="3" OnClick="Calculator.Result.value += '3'"></td>
</tr>
<tr>
<td><Input type="button" Name="four" Value="4" OnClick="Calculator.Result.value += '4'"></td>
<td><Input type="button" Name="five" Value="5" OnClick="Calculator.Result.value += '5'"></td>
<td><Input type="button" Name="six" Value="6" OnClick="Calculator.Result.value += '6'"></td>
<td><Input type="button" Name="seven" Value="7" OnClick="Calculator.Result.value += '7'"></td>
</tr>
<tr>
<td><Input type="button" Name="eight" Value="8" OnClick="Calculator.Result.value += '8'"></td>
<td><Input type="button" Name="nine" Value="9" OnClick="Calculator.Result.value += '9'"></td>
<td><Input type="button" Name="plus" Value="+" OnClick="checkValid()"></td>
<td><Input type="button" Name="minus" Value="-" OnClick="Calculator.Result.value += '-'"></td>
</tr>
<tr>
<td><Input type="button" Name="equals" Value="=" OnClick="Calculator.Result.value = eval(Calculator.Result.value)"></td>
<td><Input type="button" Name="divide" Value="/" OnClick="Calculator.Result.value += '/'"></td>
<td><Input type="button" Name="multiply" Value="*" OnClick="Calculator.Result.value += '*'"></td>
<td><Input type="button" Name="clear" Value="C" OnClick="Calculator.Result.value = ''"></td>
</tr>
</table>
<span id="HoursWorkedThisWeek"></span>
<Input type="button" Name="Save" Value="Save" OnClick="Calculator.HoursWorkedThisWeek = Calculator.Result.value">
<Input type="button" Name="Submit" Value="Submit">
</form>
<script type="text/JavaScript">
function checkValid()
{
var Calculator = document.getElementById("Calculator")
var test =Calculator[4].value;
if (parseInt(Calculator[4].value) === parseInt(test, 10))
{
alert("Integer!");
}
else
{
alert("Not an integer, press C");
}
}
</script>
</body>
</html>
解决方案2
0 2015-03-16 04:59:27
You made a few small mistakes that caused your code to not work. 您犯了一些小错误，导致您的代码无法正常工作。
I'll explain them after this working example : 在这个工作示例之后，我将对其进行解释：
function validate() { if (Calculator.Result.value == parseInt(Calculator.Result.value,10)) { alert("Integer!"); } else { alert("Not an integer, press C"); } }
<body> <form name="Calculator"> First name: <br /><input type="text" name="firstname" /><br /> Last name: <br /><input type="text" name="lastname" /><br /> Student ID: <br /><input type="text" name="ID" /><br /> Biography: <br /><textarea maxlength=30 rows="2" cols="30"></textarea><br /> Result: <table border="1" style="width:100%;"> <input type="text" name="Result" size="12" /> <tr> <td><input type="button" name="zero" value="0" onclick="Calculator.Result.value += '0'" /> </td> <td><input type="button" name="one" value="1" onclick="Calculator.Result.value += '1'" /></td> <td><input type="button" name="two" value="2" onclick="Calculator.Result.value += '2'" /></td> <td><input type="button" name="three" value="3" onclick="Calculator.Result.value += '3'" /></td> </tr> <tr> <td><input type="button" name="four" value="4" onclick="Calculator.Result.value += '4'" /></td> <td><input type="button" name="five" value="5" onclick="Calculator.Result.value += '5'" /></td> <td><input type="button" name="six" value="6" onclick="Calculator.Result.value += '6'" /></td> <td><input type="button" name="seven" value="7" onclick="Calculator.Result.value += '7'" /></td> </tr> <tr> <td><input type="button" name="eight" value="8" onclick="Calculator.Result.value += '8'" /></td> <td><input type="button" name="nine" value="9" onclick="Calculator.Result.value += '9'" /></td> <td><input type="button" name="plus" value="+" onclick="validate()" /></td> <td><input type="button" name="minus" value="-" onclick="Calculator.Result.value += '-'" /></td> </tr> <tr> <td><input type="button" name="equals" value="=" onclick="Calculator.Result.value = eval(Calculator.Result.value)" /></td> <td><input type="button" name="divide" value="/" onclick="Calculator.Result.value += '/'" /></td> <td><input type="button" name="multiply" value="*" onclick="Calculator.Result.value += '*'" /></td> <td><input type="button" name="clear" value="C" onclick="Calculator.Result.value = ''" /></td> </tr> </table> <span id="HoursWorkedThisWeek"></span> <input type="button" name="Save" value="Save" onclick="Calculator.HoursWorkedThisWeek = Calculator.Result.value" /> <input type="button" name="Submit" value="Submit" /> </form> </body>
（ 小提琴： http : //jsfiddle.net/z8umk2c6/6/ ）
- You had all your elements inside the
<head>tag.您将所有元素都放在了<head>标记内。 Only the<script>should be inside the head (or better yet, in a separate JS-file), all the HTML elements should be inside a<body>tag.只有<script>应该在头部内（或者更好的是，在单独的JS文件中），所有HTML元素都应该在<body>标记内。 - Your form didn't have an
id, only aname.您的表单没有id，只有name。 Therefor the variableCalculator(bad practice to use uppercase for variable-names) referred to nothing.因此，变量Calculator（对于变量名使用大写字母的错误做法）一无所获。 In your case you don't even need the variable, because you just access the form by name directly, so I removed that variable at the start of the function.在您的情况下，您甚至不需要该变量，因为您只需直接按名称访问表单，因此我在函数开始时删除了该变量。
(I recommend using ID's instead of names however, but that might just be personal preference.)（不过，我建议使用ID而不是名称，但这可能只是个人喜好。） - The
===in the if-clause didn't work, it was too strict.if子句中的===无效，太严格了。==will work however.==将起作用。 - "test" in the if-clause was nothing, it had no value. if子句中的“测试”没什么，它没有价值。 I rewrote the if-clause so that the value is checked against the integer-value of itself. 我重写了if子句，以便对照自身的整数值检查该值。 If that integer-value is equals the original value, you know the original was an integer already. 如果该整数值等于原始值，则您知道原始已经是整数。
And a few other mistakes that may or may not break the code, but were bad practice non the less: 还有一些其他可能会或可能不会破坏代码的错误，但仍然是不好的做法：
-
OnClickshould beonclick(all lowercase).OnClick应该是onclick（全部为小写）。 Same goes forNameandValue.Name和Value。 - Some
<input>were written with an uppercase:<Input>.一些<input>用大写形式编写：<Input>。 -
<br>and<input>need their own closing tags, like so:<br />and<input /><br>和<input>需要它们自己的结束标记，如下所示：<br />和<input />
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.
相关问题
通过按钮onclick调用功能 - Call function from button onclick
从<button onclick="“”"></button> - Exectue PHP Function from <button onclick=“”>
从 javascript 激活 HTML 按钮（onClick 函数） - Activate HTML button (onClick function) from javascript
从onclick = function（）获取按钮的内容 - Get the content of a button from onclick=function()
从按钮调用jquery函数（不使用onclick） - call jquery function from button (not using onclick)
无法从按钮onClick运行功能 - Can't run function from button onClick
在按钮onClick中从另一个控制器调用功能 - call function from another controller in a button onClick
从另一个函数onclick button2停止递归函数调用onclick button1 - stopping a recursive function call onclick button1 from a different function onclick button2
功能中的按钮onclick - Button onclick in function
按钮 onclick 函数未被调用 - button onclick function is not called
相关标签