javascript - Javascript の document.getElementsByName() 関数がおかしい

Question

シンプルな JavaScript 電卓に次の変数があります。

var distance = parseInt(document.getElementsByName("distance"), 10);
var mins_running = parseInt(document.getElementsByName("mins_running").value, 10);  // the running pace minutes
var secs_running = parseInt(document.getElementsByName("secs_running").value, 10);  //    the running pace seconds
var mins_walking = parseInt(document.getElementsByName("mins_walking").value, 10);  // the walking pace minutes
var secs_walking = parseInt(document.getElementsByName("secs_walking").value, 10);  // the walking pace seconds

問題は、これらの変数を使用しようとするときです (フォームからテキストとして入力されますが、電卓で数値として使用されることを意図しています)。開発者の console.log で typeof() を実行すると、値は「数値」型であると言われますが、たとえば、次の行も console.log('mins_running') であり、明示的に述べています値は「NaN」です。私の値は数値ですか？どうしたの？ばかばかしい javascript -- もっと普通になろうぜ！

合理的な入力/ヘルプをいただければ幸いです。

みんな、助けてくれてありがとう。代わりに古い Form.elementName.value の使用に戻ったようです。(これが本当に悪い考えである場合、または製品コードにまったく適していない場合は、遠慮なく何か言ってください。)

score 6 · Accepted Answer

document.getElementsByName("mins_running")

NodeList属性を持たないを返しますvalue。使用する

document.getElementsByName("mins_running")[0].value

代わりは。

例：

HTML:

<input type="text" name="mins_running" value="10">
<br><button id="theButton">Click Me</button>

JavaScript:

document.getElementById("theButton").onclick = function() {
  // Note we're getting the first match ----------------vvv
  var field = document.getElementsByName("mins_running")[0];
  display("The field's current value is: " +
          parseInt(field.value, 10));
  // And using its value-^^^^^
};

function display(msg) {
  var p = document.createElement('p');
  p.innerHTML = String(msg);
  document.body.appendChild(p);
}

ライブコピー| ソース

score 1 · Accepted Answer

Waleed はそれを修正する方法を共有しました。

あなたがそこにたどり着いた技術的な理由NaNは...

NodeListwithへの参照を取得し、document.getElementsByName("distance")そのプロパティにアクセスしようとしますvalue。NodeListそのプロパティは、またはプロトタイプチェーンのどこにも存在しません。JavaScript では、その意味undefinedが返されます。

を最初の引数として呼び出すparseInt()とundefined、関数はtoString()それを実行してを返し"undefined"ます。ベースをとして明示的に設定します。これは明らかにからまでの10数字のみをカバーし、数値を解析することはできません。この場合、を返します。は型 (IEEE-754 仕様の一部) であるため、演算子は.09parseInt()NaNNaNNumbertypeof"Number"

ベースをに設定すると31、を解析でき、次のよう"undefined"になります26231474015353:)

score -1 · Accepted Answer

-1

タグのIDを設定し、代わりにgetElementByIdを使用してください。

于 2012-12-23T23:33:20.393 に答える

javascript - Javascript の document.getElementsByName() 関数がおかしい

3 に答える 3

Related

Reference