ホームページ > 記事 > ウェブフロントエンド > JavaScript は簡単な計算機を実装します

JavaScript は簡単な計算機を実装します

高洛峰オリジナル: 2017-02-04 13:53:501158ブラウズ

はじめに

皆さんこんにちは。私はフロントエンドの js と jq が十分に習熟できず、多くのアルゴリズムや基本的な使い方を忘れてしまわないように、しばらく勉強してきて、フレームワークと背景の内容を学びました。いくつかの小さな機能を徐々に更新していきます。エフェクトコードは記録と蓄積に使用されます。現時点では、カプセル化とコードの冗長性は厳密には必要ありません。

単純な加算、減算、乗算、除算の計算機。値を取得するには、フォームの値を使用します。エディターに直接コピーして、開いて実行できます。

<!DOCTYPE html>
<html>
 <head>
 <meta charset="UTF-8">
 <title>加减乘除计算器</title> 
 <script type="text/javascript">
  function count(){  
  var a = parseInt(document.getElementById("txt1").value);
  var b = parseInt(document.getElementById("txt2").value) ;
  var sign = document.getElementById("select").value;
  var result = 0;
    switch(sign){
      case "+": result = a+b;
      break;
      case "-": result = a-b;
      break;
      case "*": result = a*b;
      break;
      case "/": result = a/b;
      break;
      case "%": result = a%b;
      break;
     }
  document.getElementById("answer").value = result;
  }
 </script> 
 </head> 
 <body>
  <input type=&#39;text&#39; id=&#39;txt1&#39; /> 
  <select id=&#39;select&#39;>
    <option value=&#39;+&#39;>+</option>
    <option value="-">-</option>
    <option value="*">*</option>
    <option value="/">/</option>
    <option value="%">%</option>
  </select>
  <input type=&#39;text&#39; id=&#39;txt2&#39; /> 
    <input type=&#39;button&#39; value=&#39; = &#39; onclick="count()"/> 
    <!--通过 = 按钮来调用创建的函数，得到结果-->
  <input type=&#39;text&#39; id=&#39;answer&#39; />  
 </body>
</html>

上記は全体です。この記事の内容が皆さんの学習に役立つことを願っています。また、皆さんが PHP 中国語 Web サイトをサポートしてくれることを願っています。

シンプルな電卓の JavaScript 実装に関連するその他の記事については、PHP 中国語 Web サイトに注目してください。

声明：

この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

前の記事：js ショッピングカートの実装アイデアとコード次の記事：js ショッピングカートの実装アイデアとコード

続きを見る

JavaScript は簡単な計算機を実装します

関連記事