Как запустить код Javascript при первом загрузке страницы?

Question

У меня есть функция JS для вычисления данных, умноженных на другие входные данные.

var item1unitp = 150; 
var item2unitp = 320; 

function total() { 

    var x1 = document.getElementById('t1').value; 
    var x1p = parseInt(x1); 
    var tot1 = item1unitp * x1p; 

    var x2 = document.getElementById('t2').value; 
    var x2p = parseInt(x2); 
    var tot2 = item2unitp * x2p; 

    var tot = tot1+tot2; 

    document.getElementById('tot').innerHTML = tot; 
} 

и мой HTML

Item 1 : <input type="text" id="t1" value="1" onkeyup="total();"/> <br/><br/> 

Item 2 : <input type="text" id="t2" value="1" onkeyup="total();"/> <br/><br/> 

Sub Total : <span id="tot"></span> 

Этот код работает, но в начале страницы этот диапазон не показывает ничего. Но я уже добавил значение 1 для каждого ввода. Как я получаю начальный промежуточный итог в начале ???

Answer 1

Я думаю, что это то, что вы ожидаете, скажите мне, если это неправильно.

Sub Total : <span id="tot" value="total()"></span> 
<script> 
var item1unitp = 150; 
var item2unitp = 320; 

function total() { 

    var x1 = document.getElementById('t1').value; 
    var x1p = parseInt(x1); 
    var tot1 = item1unitp * x1p; 
    var x2 = document.getElementById('t2').value; 
    var x2p = parseInt(x2); 
    var tot2 = item2unitp * x2p; 
    var tot = tot1+tot2; 

    document.getElementById('tot').innerHTML = tot; 
    return tot; 
} 
total(); 
</script> 

Answer 2

Попробуйте это. Мы устанавливаем функцию total для вызова при загрузке страницы. Также рекомендуется установить обработчики событий для onkeyup в JS, а не в HTML. Это должно отделить макет и поведение веб-сайта, поэтому я тоже это сделал.

HTML

Item 1 : <input type="text" id="t1" value="1" /> <br/> <br/> 
Item 2 : <input type="text" id="t2" value="1" /> <br/> <br/> 
Sub Total : <span id="tot"></span> 

JS

var item1unitp = 150; 
var item2unitp = 320; 

t1.onkeyup = total; 
t2.onkeyup = total; 
window.onload = total; 

function total(){ 

    var x1 = document.getElementById('t1').value; 
    var x1p = parseInt(x1); 
    var tot1 = item1unitp * x1p; 

    var x2 = document.getElementById('t2').value; 
    var x2p = parseInt(x2); 
    var tot2 = item2unitp * x2p; 

    var tot = tot1+tot2; 

    document.getElementById('tot').innerHTML = tot; 
} 

https://jsfiddle.net/y5pgrcc4/