JavaScript--事件编程

作者: 春铃邃晓 | 来源:发表于2018-02-28 22:28 被阅读0次

JavaScript--事件编程
高性能javascript--编程实践
JavaScript--事件委托
JavaScript--事件（下）
JavaScript--事件（上）
JavaScript--事件（中）
2018-05-28
WebStorm自动完成和代码提示的设置
RxSwift分享1
RxSwift学习

使用JS完成一个简单的计算器功能。实现2个输入框中输入整数后，点击第三个输入框能给出2个整数的加减乘除。
提示：获取元素的值设置和获取方法为：例：赋值：document.getElementById(“id”）.value = 1；取值：var = document.getElementById(“id”）.value；

<!DOCTYPE html>
<html>
 <head>
  <title> new document </title>  
  <script type="text/javascript">
   function count(){
                 //获取第一个输入框的值
        var txt1   = parseInt( document.getElementById('txt1').value);
                //获取第二个输入框的值
        var txt2   = parseInt( document.getElementById('txt2').value);
                //获取选择框的值
        var select = document.getElementById('select').value;
        var result = '';
        switch (select)
         {
            case '+':
                result = txt1 + txt2;
                break;
            case '-':
                result = txt1 - txt2;
                break;
            case '*':
                result = txt1 * txt2;
                break;
            case '/':
                result = txt1 / txt2;
                break;  
         }
         //设置结果输入框的值
         document.getElementById('fruit').value = result; 
   }
  </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>