document.getElementById只能在firefox中使用

时间:2014-06-22 11:13:58

标签: javascript html

我已经编写了一个js来做一些数学运算,只是一些简单的东西,而且当我使用firefox时它工作正常,但是当我尝试将它用于另一个浏览器时 - 它选择了#39 ;吨。我是html和js的新手。以下是整个事情。

代码:

    <!DOCTYPE html>

<html>
<head>
    <title>Forkalkulator</title>
</head>

<body>

<p><b>Forkalkulator </b> </p>
<form action="history.go()" method="post" enctype="multipart/form-data">
        <label for="vekt">Hundens vekt:</label>
        <input type="number" name="vekt" id="vekt" placeholder="vekt"><br>

        <label for="prisvf">Pris p&aring; v&aring;tforet:</label>    
    <input type="number" name="vfor_pris" id="vfor_pris" placeholder="pris pa vatfor"><br>

        <label for="pristf">Pris p&aring; t&oslash;rforet;:</label>     
    <input type="number" name="tfor_pris" id="tfor_pris" placeholder="pris pa torrfor"><br>

        <label for="fett">Fettprosent;</label> 
    <input type="number" name="tfor_fett" id="tfor_fett" placeholder="fett i torrfor">

        <label for="karb">Prosent karbohydrater</label>    
    <input type="number" name="tfor_karb" id="tfor_karb" placeholder="karb i torrfor">

        <label for="protin">Proteinprosent</label>    
    <input type="number" name="tfor_prot" id="tfor_prot" placeholder="prot i torrfor"> <br>

        <input type="button" value="OK" onClick="history.go()">
    <input type="reset" value="Reset" onClick="history.go()">
</form>




 <script language="javascript">

//henter verdien av input
    var vekt = document.getElementById('vekt').value;
    var pris = document.getElementById('vfor_pris').value;


//for å regne ut vedlikeholdsbehovet
var vedlike = vekt * 134 * 0.75;

//document.write(vekt);
document.write ('<br>Vedlikeholdsbehov ' + vedlike + ' kcal');

//regne ut antall gram med vom iht. vedlikeholdsbehov

var gram = vedlike/2.3;
var gram2 = gram.toFixed(2);



//torrfor

var tfor_fett = document.getElementById('tfor_fett').value / 100;
var tfor_karb = document.getElementById('tfor_karb').value / 100;
var tfor_prot = document.getElementById('tfor_prot').value / 100;
var tfor_tot = tfor_fett + tfor_karb + tfor_prot;

//regne ut hvor mange kcal utifra naeringsinnhold

var tfor_fett_kcal = tfor_fett * 9;
var tfor_karb_kcal = tfor_karb * 4.5;
var tfor_prot_kcal = tfor_prot * 4.5;
var tfor_tot_kcal = tfor_fett_kcal + tfor_karb_kcal + tfor_prot_kcal;
var tfor_tot_kcal2 = tfor_tot_kcal /1000;

//document.write('<br><br><br><b> torrfor  </b>    ' + tfor_tot_kcal + ' <br><br>');


//document.write('<br><br><br>total kcal ' + vfor_tot_kcal);

var kg = gram / 1000;
var pris_hund = kg * pris;
var pris_hund2 = pris_hund.toFixed(2);

document.write('<br><br><h3>Vom </h3>');
document.write('<br><br>Antall gram med vom: ' + gram2); 
document.write('<br><br>Pris per hund: ' + pris_hund2);


var tfor_gram = vedlike / tfor_tot_kcal;
var tfor_gram2 = tfor_gram.toFixed(2);

var tfor_kg = tfor_gram / 1000;
var tfor_pris = document.getElementById('tfor_pris').value;

var tfor_pris2 = tfor_pris * tfor_kg;
var tfor_pris3 = tfor_pris2.toFixed(2);

document.write('<br><br><h3>T&oslash;rrfor </h3>');
document.write('<br><br>Antall gram med torrfor: ' + tfor_gram2); 
document.write('<br><br>Pris per hund: ' + tfor_pris3);


</script> 
</body>
</html>

1 个答案:

答案 0 :(得分:1)

我很惊讶它正在发挥作用。

基本代码很好,干得好!问题是,一旦脚本运行,您的脚本就会从表单中查找值 - 这就是一切都在页面上可见的时刻。

基本上,您的脚本正在计算空表单的值。

修复:将所有脚本放入Javascript函数中。然后向将调用该函数的表单添加一个按钮。

This SO question shows you how to add an onlick handler这样做。