javascript (математика) добавление массива

Question

У меня есть два текстовых поля javascript.

<input type="text" name="test" value="300" />
<input type="text" name="test" value="500" />

Как я могу использовать javascript для оповещения об общей цене предметов в текстовом поле?

Хотелось бы что-нибудь подобное?

var price = document.getElementById("test");
alert(price)

Answer 1

Это будет учитывать все элементы input (полезно, если их много). Отфильтруйте их по type и получите их значения в цикле:

var inputs = document.getElementsByTagName("input");
var total = 0;

for (var i = 0; i < inputs.length; i++){
    if (inputs[i].type = "text"){
        total += parseInt(inputs[i].value, 10);
    }
}

alert(total);

Answer 2

То, что вы написали, не будет работать по нескольким причинам. Во-первых, как следует из названия, getElementById получает элемент на основе значения атрибута id. Вы не дали своим input элементам атрибут id, так что это не сработает.

Во-вторых, document.getElementById('someId') возвращает элемент, но вы хотите получить значение. Вы можете использовать свойство value, чтобы получить его:

var price1 = parseInt(document.getElementById("test1").value, 10);
var price2 = parseInt(document.getElementById("test2").value, 10);
alert(price1 + price2);

Это будет работать со следующим HTML:

<input type="text" name="test" id="test1" value="300" />
<input type="text" name="test" id="test2" value="500" />

Обратите внимание на использование parseInt. Свойство value возвращает строку, поэтому мы используем parseInt, чтобы попытаться разобрать это в число. Если вы не используете его, price1 + price2 просто объединит строки.

Answer 3

<input id="price1" type="text" name="test" value="300" />
<input id="price2" type="text" name="test" value="500" />

Это будет работать:

var price = document.getElementById("price1").value+document.getElementById("price2").value;
alert(price)

Примечание Нет других тегов с id="price1" или id="price2"

Answer 4

<input id="test1" type="text" name="test" value="300" />
<input id="test2" type="text" name="test" value="500" />

JS:

var price = parseInt(document.getElementById("test1").value, 10) + parseInt(document.getElementById("test2").value, 10);