1. parseFloat() 関数Web ページ上に簡単な計算機を作成し、テキスト ボックスに 2 つの数値を入力して、2 つの数値の加算、減算、乗算、除算を実行できるようにします。 2. JavaScript グローバルプロパティ
3. 完全なコード<!DOCTYPE html> <html lang="ja"> <ヘッド> <メタ文字セット="UTF-8"> <meta name="viewport" content="width=デバイス幅、初期スケール=1.0"> <meta http-equiv="X-UA-compatible" content="ie=edge"> <title>ドキュメント</title> <script type="text/javascript"> 関数cal(){ var nums = document.getElementsByName("num"); var sz = document.getElementsByName("js"); var 結果 = document.getElementsByName("rs"); var n1 = parseFloat(nums[0].value); var n2 = parseFloat(nums[1].value); /*parseFloat() 関数は文字列を解析し、浮動小数点数を返します。 この関数は、文字列の最初の文字が数字であるかどうかを指定します。そうであれば、文字列は数値の末尾に達するまで解析され、数値が数値として返されます。 文字列としてではなく。 */ スイッチ(sz[0].値){ ケース「追加」: 結果[0].値 = n1 + n2; 壊す; ケース「最小」: 結果[0].値 = n1 - n2; 壊す; ケース "mul" : 結果[0].値 = n1 * n2; 壊す; ケース "div" : 結果[0].値 = n1/n2; 壊す; } } </スクリプト> </head> <本文> <div align="center"> <input type="text" name="num" value="" onkeyup="value=value.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')" /> <select name="js" size="1"> <option value="追加">+</option> <option value="min">-</option> <option value="mul">*</option> <option value="div">/</option> </選択> <input type="text" name="num" value=""onkeyup="value=value.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')" /> = <input type="text" name="rs" value=""/><br> <button id="btn"onclick="cal()">計算</button> </div> </本文> </html> エフェクト表示: 2 つの数値を HTML に入力して加算、減算、乗算、除算する方法について説明したこの記事はこれで終わりです。より関連性の高い HTML 加算、減算、乗算、除算のコンテンツについては、123WORDPRESS.COM の以前の記事を検索するか、次の関連記事を引き続き参照してください。今後も 123WORDPRESS.COM を応援していただければ幸いです。 |
>>: 負荷分散と動的および静的分離操作を実現するDocker NginxコンテナとTomcatコンテナ
MySQL 双方向バックアップはマスター-マスター バックアップとも呼ばれ、両方の MySQL サー...
効果:スライドショーが一方向に動く場合、各画像のサイズ、位置、透明度、レベルを変更する必要があります...
1. はじめにこの記事では、主に Linux システムでコマンドライン ツールを使用してファイルを...
この記事では主に、CSS3 アニメーションで簡単な指クリックアニメーションを実装する例を紹介し、皆さ...
A. MySQLバックアップツールxtrabackupのインストール1. Percona 公式 xt...
1. 約束の説明Promise は、非同期操作の最終状態 (失敗または正常完了) とその結果の値を...
この記事では主に、CSS3 LESS で長いテキストの影を実装する方法を紹介し、皆さんと共有します。...
システム環境: centos7.4 1. データベースがインストールされているかどうかを確認します。...
文字化けしたコードの問題は次のとおりです。 この問題の原因は非常に単純です。コマンドラインのエンコー...
この記事では主に Vue プロジェクトを紹介します。要素の導入を前提として、コンポーネントを 2 回...
目次序文1. 少ない2. コンポーネントをインポートする3. 設定ファイルを変更するステップ1: l...
問題の説明:たとえば、ファイル 11 の内容は次のとおりです。こんにちはファイル22の内容は次のとお...
序文MySQL データのインポートとエクスポートは mysqldump コマンドで解決できることは誰...
基礎リレーショナル データベースでは、各データ テーブルはファイルに相当し、異なるストレージ エンジ...
序文一般的な方法はここには記載されていませんが、等しいかどうかを判断するための二重ループや、比較のた...