参考文献
javascriptで文字列をフロートに変換する方法は? jQuery 計算 NaN
ゴール
ユーザーから 2 つの数値入力値を受け取ります。2 番目の数値を最初の数値で割ります。結果に 100 を掛けて、パーセンテージで表します。各数値と結果を個々のリストに追加します。onClick コマンドで関数 getTextInput() を呼び出します。
バックグラウンド
私は主に Java を扱っています。私は現在、データ構造のクラスにいます (CS 2 年生)。私の能力は中級です。JavaScript に関する私の知識は基本的なものです。
問題
NaN の結果。このタスクを達成するために複数の方法を試しました。両方の入力値を解析して新しい変数に割り当て、両方の初期文字列入力を float 値に解析しました。ただし、これら 2 つの int 型または string 型の数値の結果を float 値に解析する際にまだ問題があります。int 型のパラメーターの float 値に解析する必要がありますか? 文字列値を int 値に変換すると、プログラムは入力値を受け入れず、クラッシュします。なぜこうなった?関連する投稿をいくつか見ましたが、探している情報を提供するものは見つかりません。これを行うための最良の方法は何ですか?どんな助けや指示も大歓迎です。ありがとう。
注: コード全体は一番下に掲載されています。
方法 1 - 2 つの文字列を解析して float にしました。percentOfNumbers と percentList をコンソールに出力すると、「NaN」という結果になりました。
var num1 = document.getElementById("numString1"); var num2 = document.getElementById("numString2");
percentOfNumbers = parseFloat(num2/num1 * 100); percentList.push(percentOfNumbers); percentOfNumbers.value = "";
// List1 に num1 を追加 List1.push(num1.value); num1.value = "";
// num2 を List2 に追加 List2.push(num2.value); num2.value= "";
方法 2 - 各テキスト入力を int 値に解析し、結果を float 値に解析しました。percentOfNumbers と percentList をコンソールに出力すると、「NaN」という結果になりました。
var num1 = document.getElementById("numString1"); var num2 = document.getElementById("numString2");
var num1Parsed = parseInt(num1); var num2Parsed = parseInt(num2);
percentOfNumbers = parseFloat(num2Parsed/num1Parsed * 100); percentList.push(percentOfNumbers); percentOfNumbers.value = "";
// num1 を List1 に追加 List1.push(num1Parsed.value); num1Parsed.value = "";
// num2 を List2 に追加 List2.push(num2Parsed.value); num2Parsed.value= "";
// 入力値の例、num1 の場合は 2000、num2 の場合は 2233
// コード全体
<!--
To change this template, choose Tools | Templates
and open the template in the editor.
--><!DOCTYPE html>
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script>
// separate lists for repeat user input values for num1, num2, and percentageOfNumbers
var List1 = [];
var List2 = [];
var percentageList = [];
var percentOfNumbers = 0;
var num1Parsed = 0;
var num2Parsed = 0;
function getTextInput() {
// retrieve two numbers of type 'String' from user and assign to appropriate var
var num1 = document.getElementById("numString1");
var num2 = document.getElementById("numString2");
// parse each string input number into an int
num1Parsed = parseInt(num1);
num2Parsed = parseInt(num2);
// divide second number by first number
// parse result and assign to percentOfNumbers var
// add percentOfNumbers value to percentageList
// reassign percentOfNumbers to ""
percentOfNumbers = (num2Parsed/num1Parsed * 100);
percentageList.push(percentOfNumbers);
percentOfNumbers.value = "";
// add num1 to List1
List1.push(num1Parsed.value);
num1Parsed.value = "";
// add num2 to List2
List2.push(num2Parsed.value);
num2Parsed.value= "";
}
</script>
</head>
<body>
<input id="numString1" type="text" name="input1" value="" />
<input id="numString2" type="text" name="input2" value="" />
<input id="inputField" type="button" name="search" value="compute" onClick="getTextInput();" />
</body>
</html>