如何使用文本框用户在JS函数和循环中输入数据

时间:2015-03-22 18:38:57

标签: javascript html

我的代码排序正常,但我想调整它,似乎无法构建我期望的方式。基本上我有两个标签和输入。要求用户输入一定的周数(在代码中我将其保留为3,但打算出去更长时间)并且每周输入的补充包的天数。单击按钮并调用函数。我希望该功能提示用户输入他们每天服用的包数(如果输入了2周,他们每周仅补充3次,我只想在第1周和第3周迭代提示3天第二周的日子。当输入每一天时,信息被输出回屏幕并且给出每周的小计。对于初学者,我认为我已经学到了很多东西,主要是因为这个网站。提前谢谢。

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Supplement Intake Log</title>
<link href="style.css" rel="stylesheet" type="text/css">
<!--JS Code here-->
<script>
    function getPho() {
    var week = document.getElementById("week").value;
    var day = document.getElementById("day").value;
    var numPacks = 0;
    var subtotal = 0;
    var count = 0;
    var total = 0;
    week = parseInt(week);
    day = parseInt(day);
        for(week = 1; week < 3; week++)
        {
            document.getElementById("output1").innerHTML="Week " + week + "
<br>";
            count = 1; 
            subtotal = 0;
            for(day = 1; day < 8; day++)
            {
                numPacks = parseInt(prompt("Enter the number of packs for 
week " + week + " and day " + day + " . ", ""));
                document.getElementById("output2").innerHTML+="Number of 
packs for day " + day + " = " + numPacks + " supplement packs."+ "<br>";
                subtotal = subtotal + numPacks;
                count++;
            }
            total = total + subtotal;
            document.getElementById("output3").innerHTML="Week " + week + " 
subtotal is " + subtotal + " supplement packs." + "<br>";
        }
            document.getElementById("output4").innerHTML="The total for 
these weeks is " + total + " supplment packs." + "<br>";
    }
</script>
</head>
<body>
<header><h1>Weekly Supplement Intake Log</h1></header>
<section>
<label>Number of weeks on supplements:</label>
<input type="text" name="week" id="week" value=""><br>
<label>Number of days supplements taken each week:</label>
<input type="text" name="day" id="day" value="">

<div id="button">
<button type="button" id="calc" onClick="getPho()">Enter the number of  
 packs taken each day/week</button></div>
<div id="output1"></div> 
<div id="output2"></div> 
<div id= "output3"></div>

<div id="output4"></div>

</body>
</html>

1 个答案:

答案 0 :(得分:0)

这个小提琴将循环播放几周,每周循环播放每周的日子,并要求用户输入每天拍摄的包装数量。

    var i=0;
while(i<numWeeks) {
    var d=0;
    while(d<daysPerWeek){

https://jsfiddle.net/auco824j/2/