Проблема вычисления JavaScript - сообщение NaN - PullRequest
Новая
       0

Проблема вычисления JavaScript - сообщение NaN

0 голосов
/ 14 июля 2011

Я вычисляю общее количество. Я получаю значения сумм от div's. Но в итоге вместо цифр я получаю (NaN - не число)

Функция JavaScript: 

<script type="text/javascript">
            function calculateTotal(){
                var total = document.getElementById('valor1').innerHTML*1 + document.getElementById('valor2').innerHTML*1 + document.getElementById('valor3').innerHTML*1 + document.getElementById('valor4').innerHTML*1 + document.getElementById('valor5').innerHTML*1 + document.getElementById('valor6').innerHTML*1;
                document.getElementById('total').innerHTML = total;
            }
</script>

EDIT:

Я нашел ошибку, у меня внутри закрывающего тега был закрывающий тег: 

<center><div id="valor1"></center></div>

Изменено на: 

<center><div id="valor1"></div></center>

Ответы [ 5 ]

9 голосов
/ 14 июля 2011

Вы не можете использовать document.getElementById ('valor1'). InnerHTML напрямую.Вы должны преобразовать это в число.Пожалуйста, попробуйте это. 

var value = document.getElementById('valor1').innerHTML;
var number = parseFloat(value)||0;

Сделайте это для каждого div innerHTML с номером. 

var number = parseFloat(value)||0;

Приведенная выше строка поможет вам присвоить 0 значению, если div пуст или div htmlнельзя преобразовать в число.

4 голосов
/ 14 июля 2011

Используйте parseFloat(document.getElementById('x').innerHTML) для преобразования их в числа перед выполнением операций: 

var total = parseFloat(document.getElementById('x1').innerHTML) + parseFloat(document.getElementById('x2').innerHTML);

Вы также можете проверить их, если они числовые, вот простой тест с использованием isNaN: 

alert((isNaN("23"))?'not number':'number');
3 голосов
/ 14 июля 2011

HTML: 

<div id="valor1">2</div>
<div id="valor2">2</div>
<div id="valor3">ccccc</div>
<div id="valor4">2</div>
<div id="valor5">2</div>
<div id="valor6">2</div>
<hr/>
<div id="total">0</div>

JavaScript: 

function $(id) { return document.getElementById(id); }
function get(elem) { return parseFloat($(elem).innerHTML) || 0; }

(function() {
    var total =
        get('valor1') * 1 + get('valor2') * 1 + get('valor3') * 1 + 
        get('valor4') * 1 + get('valor5') * 1 + get('valor6') * 1;
    $('total').innerHTML = total;
}());

Небольшая оптимизация работы и демо .

Но зачем останавливаться на достигнутом??:) мы можем сделать это еще лучше (я думаю): 

function get(elem) {
    return (parseFloat($(elem).innerHTML) || (function() {
        $(elem).innerHTML += " <i>Not a number assumed 0</i>";
        return 0;
    }()));
}

И обновленная демоверсия .

Редактировать: нет ошибок в Chrome & Mozilla (Linux).

1 голос
/ 14 июля 2011

попробуйте использовать parseInt (), как в 

var total = parseInt(document.getElementById('valor1').innerHTML)*1 + parseInt(document.getElementById('valor2').innerHTML)*1 + ... ;

и т.д.

0 голосов
/ 14 июля 2011

Вы пытались поместить эти части в скобки? 

(document.getElementById('valor1').innerHTML * 1) + ...

См .: http://rx4ajax -jscore.com / ecmacore / operator / predence.html

Еще лучше - используйте функцию parseInt (var string); 

parseInt(document.getElementById('valor1').innerHTML) + ...
...