JavaScript 多个错误消息

JavaScript Multiple Error Messages

本文关键字:消息 错误 JavaScript      更新时间:2023-09-26

用户输入,单击按钮,然后调用一个函数来执行一些计算。 如果字段的类型或值不正确,则会显示一条错误消息。 如果其中一个字段错误,则该字段需要显示错误消息。 如果多个字段错误,则需要显示错误消息。 现在,如果字段错误,即使所有字段都错误,页面也仅显示一条错误消息。 我确信这是一个简单的解决方案,但我总是用头撞墙。 有什么建议吗? 谢谢! 以下是代码的适用部分:

    if (isNaN(theMilesDriven) || theMilesDriven <= 0) {
            theMilesDrivenError.firstChild.nodeValue = "Please enter a number greater than 0 for the miles driven.";
            return false;
        }
        if (isNaN(theGallonsUsed) || theGallonsUsed <= 0) {
            theGallonsUsedError.firstChild.nodeValue = "Please enter a number greater than 0 for the gallons of gas used.";
            return false;
        }
        if (isNaN(thePriceGallon) || thePriceGallon <= 0) {
            thePriceGallonError.firstChild.nodeValue = "Please enter a number greater than 0 for the price per gallon.";
            return false;
        }

如果发现前两个错误之一,您的解决方案仍将进行计算。这是一个替代方案:

    var isErrorFound = false;
    if (isNaN(theMilesDriven) || theMilesDriven <= 0) {
        theMilesDrivenError.firstChild.nodeValue = "Please enter a number greater than 0 for the miles driven.";
        isErrorFound = true;
    }
    if (isNaN(theGallonsUsed) || theGallonsUsed <= 0) {
        theGallonsUsedError.firstChild.nodeValue = "Please enter a number greater than 0 for the gallons of gas used.";
        isErrorFound = true;
    }
    if (isNaN(thePriceGallon) || thePriceGallon <= 0) {
        thePriceGallonError.firstChild.nodeValue = "Please enter a number greater than 0 for the price per gallon.";
        isErrorFound = true;
    }
    if (!isErrorFound) {
        //Perform the calculations and write the results to the page
        var milesPerGallon = theMilesDriven / theGallonsUsed;
        var theMPG = document.getElementById("mpg");
        theMPG.firstChild.nodeValue = "Your MPG is: " + milesPerGallon.toFixed(2);
        var cost = theGallonsUsed * thePriceGallon;
        var theCost = document.getElementById("cost");
        theCost.firstChild.nodeValue = "Your cost for this trip is: $" + cost.toFixed(2);
    }

以下是我所做的似乎可以解决问题的方法:

    //Verify the input is numerical and greater than 0
        if (isNaN(theMilesDriven) || theMilesDriven <= 0) {
            theMilesDrivenError.firstChild.nodeValue = "Please enter a number greater than 0 for the miles driven.";
        }
        if (isNaN(theGallonsUsed) || theGallonsUsed <= 0) {
            theGallonsUsedError.firstChild.nodeValue = "Please enter a number greater than 0 for the gallons of gas used.";
        }
        if (isNaN(thePriceGallon) || thePriceGallon <= 0) {
            thePriceGallonError.firstChild.nodeValue = "Please enter a number greater than 0 for the price per gallon.";
        }
        else {
            //Perform the calculations and write the results to the page
            var milesPerGallon = theMilesDriven / theGallonsUsed;
            var theMPG = document.getElementById("mpg");
            theMPG.firstChild.nodeValue = "Your MPG is: " + milesPerGallon.toFixed(2);
            var cost = theGallonsUsed * thePriceGallon;
            var theCost = document.getElementById("cost");
            theCost.firstChild.nodeValue = "Your cost for this trip is: $" + cost.toFixed(2);
        }