1

我正在尝试用 HTML 和 javascript 制作一个非常简单的计算器，但它仍然不起作用

我的问题是：
1. 如何从表单中获取值并将其设置为数字，而不是字符串？
2. 如何在javascript中进行二次计算？
3. 如何使用 javascript 更新 html 内容？因此，每当我更改输入表单的值并按下提交时，结果都会根据我输入的输入而改变，我尝试了document.getElementById("idhere").innerHTML=valuehere; 但仍然无法正常工作。

<script tyle="text/javascript">
function calculateThis(form) {
var userweight=form.weight.value;
var caffeineamount=form.caffein.value;
var caffeinetimes=form.caffeintimes.value;
var totalcaffeine=caffeineamount*caffeinetimes;

// Calculate max caffeine per person
var maxcaffeine=userweight*10;

// Calculate remaining after 24 hours
// Half life = 6 hours
var totalcaffeineafter=totalcaffeine(1/16);

// Calculating how many hours until the caffeine completely digested
var totaldigest=totalcaffeine;
var digesttime=0;

while (totaldigest>0.05) {
totaldigest=totaldigest(1/2);
digesttime++;
}

digesttime=digesttime*6;

// Calculating when the user will probably die of overdose
var countcaffeine=0;
var overdosetime=1;

while (countcaffeine<maxcaffeine){
countcaffeine=countcaffeine+totalcaffeine;
overdosetime++;
}

// Show total amount of caffeine
document.getElementById("showtotalkafein").innerHTML=totalcaffeine;

// Show amount of caffeine after 1 day
document.getElementById("showtotalkafeinsetelah").innerHTML=totalcaffeineafter;

// Show digest time
document.getElementById("showwaktudigest").innerHTML=digesttime;

// Show overdose
document.getElementById("showberapakali").innerHTML=overdosetime;

return false;
}
</script>

<form class="form">
Weight<br />  
<input type="text" name="weight" class="required" value="" /><p /> 
Amount of caffein in coffee<br />
<input type="text" name="caffein" class="required" value="" /><p /> 
How many times drinking coffee in a day<br /> 
<input type="text" name="caffeintimes" class="required" value="" /><p />

<button type="button" onclick="calculateThis(this.form); return false;">Calculate</button></form>

<h1>Result</h1>
<p id="showtotalkafein">Show Caffein Total Here</p> 
<p id="showtotalkafeinsetelah">Show Caffeine Amount After 24 hours</p> 
<p id="showwaktudigest">Show Digest TIme Here</p> 
<p id="showberapakali">Show Overdose Time Here</p>
4

1 回答 1

1 
function calculateThis(form) {
    var userweight = parseInt(form.weight.value, 10);
    var caffeineamount = parseInt(form.caffein.value, 10);
    var caffeinetimes = parseInt(form.caffeintimes.value, 10);
    var totalcaffeine = caffeineamount * caffeinetimes;

    console.log(totalcaffeine)
    // Calculate max caffeine per person
    var maxcaffeine = userweight * 10;

    // Calculate remaining after 24 hours
    // Half life = 6 hours
    var totalcaffeineafter = totalcaffeine * (1 / 16);

    // Calculating how many hours until the caffeine completely digested
    var totaldigest = totalcaffeine;
    var digesttime = 0;

    while (totaldigest > 0.05) {
        totaldigest = totaldigest * (1 / 2);
        digesttime++;
    }

    digesttime = digesttime * 6;

    // Calculating when the user will probably die of overdose
    var countcaffeine = 0;
    var overdosetime = 1;

    while (countcaffeine < maxcaffeine) {
        countcaffeine = countcaffeine + totalcaffeine;
        overdosetime++;
    }

    // Show total amount of caffeine
    document.getElementById("showtotalkafein").innerHTML = totalcaffeine;

    // Show amount of caffeine after 1 day
    document.getElementById("showtotalkafeinsetelah").innerHTML = totalcaffeineafter;

    // Show digest time
    document.getElementById("showwaktudigest").innerHTML = digesttime;

    // Show overdose
    document.getElementById("showberapakali").innerHTML = overdosetime;

    return false;
}

演示

笔记

在这里，我使用.parseInt()which 将数字转换为整数，如果您需要 Float 中的任何值，请使用.parseFloat()`。

代码中的问题

  • form.weight.value, form.caffein.value... 以字符串形式给出值，因此您需要将它们转换为数字（整数/浮点数）。

  • 您使用totalcaffeine(1 / 16)and totaldigest = totaldigest(1 / 2);，不是 javascript 中的有效数学运算，它应该是totalcaffeine * (1 / 16)andtotaldigest = totaldigest * (1 / 2);

根据你的评论

什么.parseInt(form.caffeintimes.value, 10)，做什么？

的格式parseInt为：

.parseInt(valueToConvert, [radix]).

因此，.parseInt(form.caffeintimes.value, 10)将form.caffeintimes.value字符串转换为 10 基整数。

相关参考：

.parseInt()

.parseFloat()

于 2012-06-09T17:12:27.540 回答