Javascript 输入框之间的计算

我正在写一个脚本，我需要得到两个计算的总数，并确定总报价。问题是，当把它们加在一起时，我无法让它们工作。请记住，我是一个新手，代码可能没有完全优化，但我相信你会明白这一点。对代码的任何改进都是非常受欢迎的

<div>
        <fieldset>
            <legend>Printing</legend>
        Number of color pages:<input type="text" id="color" placeholder="Color Pages" onchange="printing();" onchange = "binding();" />
        <input type="text" id="colorprice" readonly="readonly" /><br />
        Number of black and white pages:<input type="text" id="black" placeholder="Black and White Pages" onchange="printing();" onchange = "binding();" />
        <input type="text" id="blackprice" readonly="readyonly" /><br />
        Total Pages:<input type="text" id="pages_total" readonly="readonly" /> <input type="text" id="sum_pages" readonly="readonly" onchange = "suming();"/>
        </fieldset>

    </div>

<div>
        <fieldset>
            <legend>Binding</legend>
            Number of Hardbooks: <input type="text" id="books" placeholder="Number of Hardbooks" onchange="binding();" />
            <input type="text" id="books_price" readonly="readonly" /><br />
            Number of Softbacks: <input type="text" id="softback" placeholder="Number of Softbacks" onchange="binding();" />
            <input type="text" id="soft_price" readonly="readonly" /><br />
            Total Bindings: <input type="text" id="total_bindings" readonly="readonly" /><input type "text" id="total_price" readonly="readonly" />
        </fieldset>
    </div>

<p>Final quote:<input type="text" readonly="readonly" id="quote" /></p>

function printing() {
                var blackPrice;
                var colorPrice;
                var printBlack = new Array(0.10, 0.08, 0.06, 0.05);
                var printColor = new Array(0.40, 0.35, 0.30, 0.25);


                var colorPages = parseInt(document.getElementById("color").value);
                var blackPages = parseInt(document.getElementById("black").value);

                if (colorPages < 11) {
                colorPrice = colorPages * printColor[0];
                    }
                else if (colorPages >= 11 && colorPages < 51){
                colorPrice = colorPages * printColor[1];
                    }
                else if (colorPages >= 51 && colorPages < 101){
                    colorPrice = colorPages * printColor[2];
                    }
                else {
                    colorPrice = colorPages * printColor[3];
                    }



                if (blackPages < 11) {
                blackPrice = blackPages * printBlack[0];
                    }
                else if (blackPages >= 11 && colorPages < 51){
                blackPrice = blackPages * printBlack[1];
                    }
                else if (blackPages >= 51 && colorPages < 101){
                blackPrice = blackPages * printBlack[2];
                    }
                else {
                blackPrice = blackPages * printBlack[3];
                    }

                var pagesTotal = colorPages + blackPages;

                var printSum = blackPrice + colorPrice;


                document.getElementById("colorprice").value = "$" + colorPrice.toFixed(2);
                document.getElementById("blackprice").value = "$" + blackPrice.toFixed(2);
                document.getElementById("sum_pages").value = "$" + printSum.toFixed(2);
                document.getElementById("pages_total").value = pagesTotal;

                return printSum;

}



function binding(){

var softbackPrice;
var hardbookPrice;
var hardBooks = new Array(37.50, 23.50);
var softBacks = new Array(3.75, 4.00, 4.25, 4.50, 4.75, 5.00, 5.25);
var noBooks = parseInt(document.getElementById("books").value); 
var noSoftBacks = parseInt(document.getElementById("softback").value); 
var colorPages = parseInt(document.getElementById("color").value);
var blackPages = parseInt(document.getElementById("black").value);
var totalPages = colorPages + blackPages;

if (noBooks == 1) { 
    hardbookPrice = hardBooks[0];
    }
else {
        hardbookPrice = (hardBooks[1] * (noBooks - 1)) + hardBooks[0];
    }

if (totalPages <= 50) {
    softbackPrice = softBacks[0] * noSoftBacks;
    }
else if (totalPages > 50 && totalPages <= 100) {
    softbackPrice = softBacks[1] * noSoftBacks;
    }
else if (totalPages > 100 && totalPages <= 150) {
    softbackPrice = softBacks[1] * noSoftBacks;
    }
else if (totalPages > 150 && totalPages <=200) {
    softbackPrice = softBacks[2] * noSoftBacks;
    }
else if (totalPages > 200 && totalPages <= 250) {
    softbackPrice = softBacks[3] * noSoftBacks;
    }
else if (totalPages > 250 && totalPages <= 300) {
    softbackPrice = softBacks[4] * noSoftBacks;
    }
else if (totalPages > 300 && totalPages <= 350) {
    softbackPrice = softBacks[5] * noSoftBacks;
    }
else {
    softbackPrice = softBacks[6] * noSoftBacks;
}   



var totalPrice = softbackPrice + hardbookPrice;
var bindingsTotal = noSoftBacks + noBooks;


document.getElementById("books_price").value = "$" + hardbookPrice.toFixed(2);
document.getElementById("soft_price").value = "$" + softbackPrice.toFixed(2);
document.getElementById("total_bindings").value = bindingsTotal;
document.getElementById("total_price").value = "$" + totalPrice.toFixed(2);


return totalPrice;

}

function totalSum() {
var totalPrinting = printing();
var totalBinding = binding();
var subtotal = totalPrinting + totalBinding;
document.getElementIdBy("quote").value = subtotal;
}

这对我来说最有效：

第一次onchange计算存在问题，因为在执行parseInt之后，其他页数为NaN。如果文本框为空，则应将其默认为零

您可以使用isNaN函数来解决计算问题：

var colorPages = parseInt(document.getElementById("color").value);
var blackPages = parseInt(document.getElementById("black").value);

if (isNaN(colorPages))
{
    colorPages = 0;
}

if (isNaN(blackPages))
{
    blackPages = 0;
}

---

这是可行的解决方案

=对于以下标记中的类型缺少

<input type "text" id="total_price" readonly="readonly" />

---

我不太担心这个问题，我的意思是我知道如何解决它。我的问题是你没有得到最后的报价！！这两个独立函数运行良好，但我无法将它们相加。检查我的总和函数。无论如何，谢谢你的isNaN代码！这个问题还没有真正解决。var小计=totalPrinting+totalBinding；小计=100；它总是将引号设置为100。请检查更新的引号。请注意，我正在所有控件的onChange事件中调用totalSum函数。它工作得很好！！它实际上解决了我遇到的另一个问题，即在绑定函数中，软背数组取决于页数；在更新页数之前，它不会自动更改软背阵列的键。我不明白它是如何完全工作的，尽管现在你们已经从所有的控件中去掉了绑定和打印，并用totalSum替换了它？