本文介绍了我想修改这个程序，以便在执行操作而不是按下等于按钮时计算值的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
This is is a basic javascript calculator and it works fine but i want to modify it so operations would always perform and update instead of me clicking the equals button. what i mean is when i do something like 2+2+2+2 it does not calculate until i press the equal button.
<pre> <div class="container" >
<br>
<h1><font color="red" style= "font-size:70"> Ayoola's Calculator </font></h1>
<form name="calculator" >
<input name = "display" placeholder="0" style= "width:254px; height:60px; text-align:right; font-size:30; border-radius:8px; margin:3px"/>
<br>
<input name = "answer" placeholder="0" style= "width:254px; height:60px; text-align:right; font-size:30; border-radius:8px; margin:3px"/>
<br>
<input type="button" value= "7" name="seven" onClick="document.calculator.display.value+='7'" style="width:60px; font-size:30; margin:3px"/>
<input type="button" value= "8" name="eight" onClick="document.calculator.display.value+='8'" style="width:60px; font-size:30; "/>
<input type="button" value= "9" name="nine" onClick="document.calculator.display.value+='9'" style="width:60px; font-size:30; "/>
<input type="button" value= "*" name="multiply" onClick="document.calculator.display.value+='*'" style="width:60px; font-size:30; "/>
<br>
<input type="button" value= "4" name="four" onClick="document.calculator.display.value+='4'" style="width:60px; font-size:30; margin:3px"/>
<input type="button" value= "5" name="five" onClick="document.calculator.display.value+='5'" style="width:60px; font-size:30; "/>
<input type="button" value= "6" name="six" onClick="document.calculator.display.value+='6'" style="width:60px; font-size:30; "/>
<input type="button" value= "-" name="minus" onClick="document.calculator.display.value+='-'" style="width:60px; font-size:30; "/>
<br>
<input type="button" value= "1" name="one" onClick="document.calculator.display.value+='1'" style="width:60px; font-size:30; margin:3px"/>
<input type="button" value= "2" name="two" onClick="document.calculator.display.value+='2'" style="width:60px; font-size:30; "/>
<input type="button" value= "3" name="three" onClick="document.calculator.display.value+='3'" style="width:60px; font-size:30; "/>
<input type="button" value= "+" name="plus" onClick="document.calculator.display.value+='+'" style="width:60px; font-size:30; "/>
<br>
<input type="button" value= "." name="point" onClick="document.calculator.display.value+='.'" style="width:60px; font-size:30; margin:3px"/>
<input type="button" value= "0" name="zero" onClick="document.calculator.display.value+='0'" style="width:60px; font-size:30; "/>
<input type="button" value= "/" name="divide" onClick="document.calculator.display.value +='/'" style="width:60px; font-size:30; "/>
<input type="button" value= "=" name="equal" onClick="document.calculator.answer.value=eval(document.calculator.display.value)" style="width:60px; font-size:30; "/>
<br>
<input type="reset" value= "C" onClick= "clear" style="width:256px; font-size:30; margin:3px "/>
</form>
</div>
我尝试过：
i尝试使用funcyion但没有工作
What I have tried:
i have tried using funcyion but didnt work
推荐答案
<form name="calculator">
<input name="display" placeholder="0" style="width:254px; height:60px; text-align:right; font-size:30; border-radius:8px; margin:3px" />
<br>
<input name="answer" placeholder="0" style="width:254px; height:60px; text-align:right; font-size:30; border-radius:8px; margin:3px" />
<br>
<input type="button" value="7" name="seven" style="width:60px; font-size:30; margin:3px" />
<input type="button" value="8" name="eight" style="width:60px; font-size:30; " />
<input type="button" value="9" name="nine" style="width:60px; font-size:30; " />
<input type="button" value="*" name="multiply" style="width:60px; font-size:30; " />
<br>
<input type="button" value="4" name="four" style="width:60px; font-size:30; margin:3px" />
<input type="button" value="5" name="five" style="width:60px; font-size:30; " />
<input type="button" value="6" name="six" style="width:60px; font-size:30; " />
<input type="button" value="-" name="minus" style="width:60px; font-size:30; " />
<br>
<input type="button" value="1" name="one" style="width:60px; font-size:30; margin:3px" />
<input type="button" value="2" name="two" style="width:60px; font-size:30; " />
<input type="button" value="3" name="three" style="width:60px; font-size:30; " />
<input type="button" value="+" name="plus" style="width:60px; font-size:30; " />
<br>
<input type="button" value="." name="point" style="width:60px; font-size:30; margin:3px" />
<input type="button" value="0" name="zero" style="width:60px; font-size:30; " />
<input type="button" value="/" name="divide" style="width:60px; font-size:30; " />
<input type="button" value="=" name="equal" onclick="document.calculator.answer.value=eval(document.calculator.display.value)" style="width:60px; font-size:30; " />
<br>
<input type="reset" value="C" onclick="clear" style="width:256px; font-size:30; margin:3px " />
<script>
var buttons = document.querySelectorAll(".container input[type=button]");
for (var i = 0; i < buttons.length; i++) {
buttons[i].onclick = function () {
if (this.value != '=') {
document.calculator.display.value += '' + this.value;
document.calculator.answer.value = eval(document.calculator.display.value)
}
};
}
</script>
</form>
function show(c) {
document.calculator.display.value += c;
document.calculator.answer.value=eval(document.calculator.display.value);
}
然后更改您的onclick活动
then change your onclick events from
onClick="document.calculator.display.value+='7'"
to
to
onClick="show('7')"
这篇关于我想修改这个程序，以便在执行操作而不是按下等于按钮时计算值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！