Подтвердить что ты не робот

Чтение чисел с входов с JavaScript всегда возвращает NaN

Я хочу создать калькулятор, который просто суммирует 2 поля вверх. Но все, что я пробовал, не работает. Он также возвращает "NaN", также если я использую parseInt().

Здесь код:

 <script type="text/javascript" language="Javascript">
 function doSum() 
 {
 var a = document.getElementsByName("a").value;
 var b = document.getElementsByName("b").value;

 var sum =  a + b;

 document.getElementById("sum").value = sum;
}
</script>

<form action="" method="POST">
<br/>a:<br/>
<input type="text" name="a" onblur='doSum()' value="0" size="5" />
<br/>b:<br/>
<input type="text" name="b" onblur='doSum()' value="0" size="5" />
<br/>Ergebnis<br/>
<input type="text" id='sum' value='' size="50" disabled/>
</form>

Извините за этот вопрос noob, но что я делаю неправильно? Спасибо за любую помощь!

4b9b3361

Ответ 1

Дайте id вашим входам и однозначно определите их, используя document.getElementById. Затем получите их десятичные значения int с помощью parseInt с параметром radix, установленным в 10, и отобразите результат, как вы сейчас делаете.

<script type="text/javascript" language="Javascript">
 function doSum() 
 {
  var a = parseInt(document.getElementById("a").value, 10);
  var b = parseInt(document.getElementById("b").value, 10);

  var sum =  a + b;

  document.getElementById("sum").value = sum;
}
</script>

<form action="" method="POST">
 <br/>a:<br/>
<input type="text" id="a" onblur='doSum()' value="0" size="5" />
 <br/>b:<br/>
<input type="text" id="b" onblur='doSum()' value="0" size="5" />
 <br/>Ergebnis<br/>
<input type="text" id='sum' value='' size="50" disabled/>
</form>

getElementsByName возвращает список элементов, и вам нужно будет ссылаться на тот, который вы хотите с помощью индекса, даже если список содержит только один элемент.

getElementById, с другой стороны, возвращает однозначно идентифицированный элемент по его идентификатору.

Ответ 2

используйте getElementById и дайте каждому из них идентификатор. getElementsByName возвращает массив. Кстати, это не плохой вопрос. Это обычная ошибка, которая рассматривается в некотором смысле с помощью jQuery, который имеет дело с завернутыми наборами.

Ответ 3

Поля в JavaScript все строки вам нужно int, также .getElementsByName возвращает массив, вам, вероятно, нужен первый элемент, поэтому:

var a = parseInt(document.getElementsByName("a")[0].value, 10);
var b = parseInt(document.getElementsByName("b")[0].value, 10);

Ответ 4

getElementsByName возвращает несколько элементов, следовательно, множественное число Elements. Вам нужно получить свойство первого найденного элемента:

var a = document.getElementsByName('a')[0].value;

getElementsByName возвращает NodeList: это набор всех элементов, найденных с этим именем. Это похоже на массив, в котором вы можете использовать числовые индексы (например, [0]) для доступа к найденным элементам и в том, что существует свойство length; нет других функций, подобных массиву.


Кроме того, свойство value всегда будет строкой, если оно установлено. Оператор + является оператором сложения, когда значения являются числами; если они являются строками, это оператор конкатенации. "1" + "2" равен "12" в Javascript. Вы должны использовать parseInt для преобразования их в числа:

var a = document.getElementsByName('a')[0].value;
a = parseInt(a, 10); // parse as a number in base 10

Ответ 5

getElementsByTagName возвращает node список:

 function doSum() 
 {
     var a = document.getElementsByName("a")[0].value;
     var b = document.getElementsByName("b")[0].value;

     var sum =  parseInt(a, 10) + parseInt(b, 10);

     document.getElementById("sum").value = sum;
}

Поэтому вам нужно будет его индексировать. Кроме того, для того, чтобы не выполнять строчную последовательность, требуется parseInt с radix 10. Если вы не планируете принимать восьмеричные значения в калькуляторе.

Ответ 6

getElementsByName возвращает массив, который дает неверный тип данных для того, что вы пытаетесь сделать.

попробовать:

function doSum() 
{
  var a = document.getElementById("a").value;
  var b = document.getElementById("b").value;

  var sum =  a + b;

  document.getElementById("sum").value = sum;

}
</script>

<form action="" method="POST">
<br/>a:<br/>
<input id="a" type="text" name="a" onblur='doSum()' value="0" size="5" />
<br/>b:<br/>
<input id="b" type="text" name="b" onblur='doSum()' value="0" size="5" />
<br/>Ergebnis<br/>
<input type="text" id='sum' value='' size="50" disabled/>
</form>

Ответ 7

ОК, две проблемы, вы получаете валуры a и b, используя getElementsByName, которое возвращает массив значений (поскольку их может быть много). Используйте getElementsById и введите идентификаторы в HTML.

Также свойства value будут строками, поэтому вам нужно будет преобразовать их в числа, прежде чем делать это.

Ответ 8

a и b - строки так:

 function doSum() 
 {
 var a = parseInt(document.getElementsByName("a").value);
 var b = parseInt(document.getElementsByName("b").value);

 var sum =  a + b;

 document.getElementById("sum").value = sum;
}