Fatal编程技术网

JavaScript计算错误

javascript html checkbox

JavaScript计算错误,javascript,html,checkbox,Javascript,Html,Checkbox,我正在尝试使用JavaScript执行计算。当用户在输入（#页）中输入少于10页时，成本为1。如果他加了10个以上，每一页的价格是0.10。复选框有两个选项，如果他单击，则添加第一个复选框10，并添加第二个复选框15 这是工作时，它是在连续的步骤完成。（输入，然后单击复选框） 例：输入为：9（总计：1） 单击复选框1-重复项（总数：11） 单击复选框1-激光器（总数：26） 现在，如果我将输入更改为11，那么总数将变为1.10-即使选中了两个复选框。。（预期结果应为-26.10） 我不知道怎么做

我正在尝试使用JavaScript执行计算。当用户在输入（#页）中输入少于10页时，成本为1。如果他加了10个以上，每一页的价格是0.10。复选框有两个选项，如果他单击，则添加第一个复选框10，并添加第二个复选框15

这是工作时，它是在连续的步骤完成。（输入，然后单击复选框）

例：输入为：9（总计：1） 单击复选框1-重复项（总数：11） 单击复选框1-激光器（总数：26）

现在，如果我将输入更改为11，那么总数将变为1.10-即使选中了两个复选框。。（预期结果应为-26.10）

我不知道怎么做…有人能帮我吗

<html>
<head>
    <title>Calculation</title>
    <script>
        function calculate() {
            var pages=document.getElementById("page").value;

            if(pages <=10) {
                total.value=1;
            }
            if(pages >= 11) {
                var extra_pages= pages - 10;
                var new_total= extra_pages * .10;
                var new_total1= 1 + new_total;
                total.value= new_total1; 
            }
        }

        function checkbox1() {
            if(document.getElementById("ckbox1").checked === true) {
                var total1=document.getElementById("total").value;
                const add1 = 10;
                var check1 = +total1 + +add1;
                total.value=check1;
            }
            if(document.getElementById("ckbox1").checked === false) {
                var total1=document.getElementById("total").value;
                 const sub1 = 10;
                 var check2 = +total1 - +sub1;
                 total.value = check2;
            }
        }

        function checkbox2() {
            if(document.getElementById("ckbox2").checked === true) {
                var total1=document.getElementById("total").value;
                const add1 = 15;
                var check1 = +total1 + +add1;
                total.value=check1;  
            }
            if(document.getElementById("ckbox2").checked === false) {
                 var total1=document.getElementById("total").value;
                 const sub1 = 15;
                 var check2 = +total1 - +sub1;
                 total.value = check2;
            }
        }
</script>
<body>
     Enter a Number: <input type="text" id="page" value="1" oninput="calculate()">
    <br>
    <br><br><br><br>
       duplicates <input type="checkbox" id="ckbox1" onclick="checkbox1()">
    laser print: <input type="checkbox" id="ckbox2" onclick="checkbox2()"> <br><br>
    Total: <input type="text" id="total">
</body>
</html>


算计
函数计算（）{
var pages=document.getElementById（“页面”）.value；
如果（第11页）{
var extra_pages=第10页；
var new_total=额外的_页面*.10；
var new_total 1=1+new_total；
总价值=新的总价值1；
}
}
函数checkbox1（）{
if（document.getElementById（“ckbox1”）.checked==true）{
var total1=document.getElementById（“total”）.value；
常数add1=10；
var check1=+total1++add1；
总值=1；
}
if（document.getElementById（“ckbox1”）.checked==false）{
var total1=document.getElementById（“total”）.value；
常数sub1=10；
var check2=+total1-+sub1；
total.value=check2；
}
}
函数checkbox2（）{
if（document.getElementById（“ckbox2”）.checked==true）{
var total1=document.getElementById（“total”）.value；
常数add1=15；
var check1=+total1++add1；
总值=1；
}
if（document.getElementById（“ckbox2”）.checked==false）{
var total1=document.getElementById（“total”）.value；
常数sub1=15；
var check2=+total1-+sub1；
total.value=check2；
}
}
输入一个数字：







复制品
激光打印：


总数：
您可以对所有更改使用
计算
，而不是为每个
输入创建每个更改，这使得计算变得复杂



//获取对输入的引用。
var page=document.getElementById（“页面”）；
var total=document.getElementById（“总计”）；
var dup=document.getElementById（“ckbox1”）；
var laser=document.getElementById（“ckbox2”）；
函数计算（）{
//计数
var pages=parseInt（page.value，10）；
var值=0；

如果（页码< >代码>计算< <代码>未考虑<代码>重复< <代码> >代码>激光打印< /代码>，因此它们将不包含。您没有定义Toal.ValueDebug DeV工具，控制台上是否弹出任何内容？什么是不工作的细节，更改页面不会改变总数？或单击复选框将无法得到正确的总数？甚至不添加数字？请检查这里，我复制粘贴代码并尝试..但当我输入输入..总计为空..同时当我单击复选框..总计字段为空..注意JSFIDLE默认在
onload
函数中包装脚本部分，这使html部分无法访问它，将其设置为
no wrap-in
>如果可以的话，试试看。当我在HTML文件中复制代码时..我应该将Javascript代码粘贴到哪里..在
正文的末尾，或者换句话说，在关闭
之前，它可以确保所有现有的HTML都被呈现，这样您的Javascript就可以访问它们了。