js-简单的计算器实例

最新推荐文章于 2021-11-19 07:50:12 发布

原创最新推荐文章于 2021-11-19 07:50:12 发布 · 251 阅读

0 ·

CC 4.0 BY-SA版权

js 专栏收录该内容

13 篇文章

订阅专栏

本文介绍了一个简单的网页计算器实现方法，利用HTML、CSS和JavaScript构建。该计算器可通过用户输入进行基本的算术运算，如加、减、乘、除，并即时显示结果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!DOCTYPE html>
<html>
 <head>
  <title> 事件</title>  
  <script type="text/javascript">
   function count(){
    var d=''; 
    txt1obj=document.getElementById('txt1').value;//获取第一个输入框的值
	txt2obj=document.getElementById('txt2').value;//获取第二个输入框的值  
	sl=document.getElementById('select').value;//获取选择框的值
	switch(sl){
	    case '+':
	    d=parseInt(txt1obj)+parseInt(txt2obj);
	    break;
	    case '-':
	    d=txt1obj-txt2obj;
	    break;
	    case '*':
	    d=txt1obj*txt2obj;
	    break;
	    case '/':
	    d=txt1obj/txt2obj;
	}//获取通过下拉框来选择的值来改变加减乘除的运算法则
    document.getElementById('fruit').value=d//设置结果输入框的值
   }
  </script> 
 </head> 
 <body>
   <input type='text' id='txt1'/> 
   <select id='select'>
		<option value='+'>+</option>
		<option value="-">-</option>
		<option value="*">*</option>
		<option value="/">/</option>
   </select>
   <input type='text' id='txt2' /> 
   <input type='button' value=' = 'onclick='count()'/> <!--通过 = 按钮来调用创建的函数，得到结果--> 
   <input type='text' id='fruit'/>   
 </body>
</html>