<html>
<head>
<title> Buttons</title>
<style type="text/css">
.intro{background-color:;}
.duction{background-color:blue;}
.function{background-color:grey;}
.equals{background-color:orange;}
</style>
</head>
<body>
<form name="calculator">
<input type="text" name="display" length="50" width="100">
<div>
<input type= "button" value="7" class="intro" id="7" onclick="one(7)"></button>
<input type= "button" value="8" class="intro" id="8" onclick="one(8)"></button>
<input type= "button" value="9" class="intro" id="9" onclick="one(9)"></button>
<input type= "button" value="+" class="intro" id="+" onclick="one(+)"></button>
<input type= "button" value="-" class="intro" id="-" onclick="one(-)"></button>
<div>
<input type= "button" value="4" class="intro" id="4" onclick="one(4)"></button>
<input type= "button" value="5" class="intro" id="5" onclick="one(5)"></button>
<input type= "button" value="6" class="intro" id="6" onclick="one(6)"></button>
<input type= "button" value="x" class="intro" id="x" onclick="one(*)"></button>
<input type= "button" value="/" class="intro" id="/" onclick="one(/)"></button>
<div>
<input type= "button" value="1" class="intro" id="1" onclick="one(1)"></button>
<input type= "button" value="2" class="intro" id="2" onclick="one(2)"></button>
<input type= "button" value="3" class="intro" id="3" onclick="one(3)"></button>
<input type= "button" value="=" class="intro" id="=" onclick="Evaluate()"></button>
<div>
<input type= "button" value="0" class="intro" id="0" onclick="one(0)"></button>
<input type= "button" value="." class="intro" id="." onclick="one(.)"></button>
<input type= "button" value="c" class="intro" onclick="clearDigit()"></button>
<script type="text/javascript" src="C:\Users\LS\Desktop\QBJS\button.js">
</script>
</body>
</html>
var timer;
var object;
var thing;
var digit="";
var result;
function one(event)
{
clearTimeout(timer);
timer=setTimeout(function(){AddDigit(event);},200);
}
在这个函数中,我开始使用regEx来检查传递给x的数字和算术运算符。那是当我意识到我的算术运算符根本没有被传递的时候。我不知道为什么!!!
function AddDigit(x)
{
alert(x);
/*if(/^\d[+-*\/$/.test(x))
{document.calculator.display.value+=x;}
else
*/ {document.calculator.display.value+=digit + x;}
}
function Evaluate()
{
result=eval(document.calculator.display.value);
document.calculator.display.value = result;
}
document.ondblclick=function(button)
{
clearTimeout(timer);
thing=button.target;
if(thing.className=="intro")
{thing.className="duction";}
else if(thing.className=="duction")
{thing.className="intro";}
}
function clearDigit()
{
document.calculator.display.value="";
}
答案 0 :(得分:1)
一个问题是one(+)
无效Javascript。试试这个:
<input type= "button" value="+" class="intro" id="+" onclick="one('+')">
与其他操作员按钮相同。
答案 1 :(得分:0)
一些建议:
从有效的HTML开始,所有关闭</button>
代码的代码都无效,并且表单没有结束标记。大多数ID值都是无效的,尽管它们并不重要,但无论如何都不需要它们。
考虑在表单上放置一个单击侦听器,然后响应调度事件的任何元素。
作为一个例子,下面是一个非常基本的计算器(它不会检查构造的表达式是否有效)。请注意,显示的数学符号与javascript数学表达式中使用的符号不同,因此屏幕上显示的符号将映射到javascript符号并存储在单独的输入中(显示在示例中但应隐藏在使用中)。
<form onclick="handleClick(this, event);">
<!-- this input should be type hidden, left visible for demo -->
<input type="text" name="store">
<table>
<tr>
<td colspan="3"><input type="text" value="" name="screen" readonly>
<td><input type="button" value="=" name="bequal">
<tr>
<td><input type="button" value="7" name="b7">
<td><input type="button" value="8" name="b8">
<td><input type="button" value="9" name="b9">
<td><input type="button" value="÷" name="bdiv">
<tr>
<td><input type="button" value="4" name="b4">
<td><input type="button" value="5" name="b5">
<td><input type="button" value="6" name="b6">
<td><input type="button" value="×" name="btimes">
<tr>
<td><input type="button" value="1" name="b1">
<td><input type="button" value="2" name="b2">
<td><input type="button" value="3" name="b3">
<td><input type="button" value="−" name="bminus">
<tr>
<td><input type="button" value="0" name="b0">
<td><input type="button" value="." name="bpoint">
<td><input type="reset" value="C" name="bclear">
<td><input type="button" value="+" name="bplus">
</table>
</form>
<script>
function handleClick(form, evt) {
// Stored symbol for eval is different to displayed symbol
var buttonMap = {
'247':'/', '215':'*', '8722':'-', '43':'+'
}
var el = evt.target || evt.srcElement;
if (el.type == 'button') {
if (el.name == 'bequal') {
// Update display with result of evaluating expression
form.screen.value = eval(form.store.value);
// Update stored value
form.store.value = form.screen.value;
} else {
// Update displayed expression
form.screen.value += el.value;
// Update expression to evaluate, map × to * and so on.
form.store.value += buttonMap[el.value.charCodeAt(0)] || el.value;
}
}
}
</script>
请注意,这只是一个演示,需要更多工作才能保持健壮,例如验证要评估的表达式(例如,不能按时间然后除以)并在按下下一个符号时评估每个表达式。