Javascript控制台日志在if语句计算结果为false后自行清除

Javascript console log clearing itself after if statement evaluates to false

本文关键字：false 清除 结果 计算 日志 控制台 if 语句 Javascript      更新时间：2023-09-26

我有以下简单的代码从一个练习在现代Javascript中用于计算一个球体的体积，它包含一个部分检查，以确保一个值已输入半径。

  • 我输入了一个负数来测试这个函数，它可以工作，但是我我对控制台显示的内容很感兴趣，所以我检查了一下。我结束了看到一个错误在日志中闪烁，然后消失-太快读取。

  • 这就是if语句计算为false时发生的情况吗?为什么这个错误显示然后几乎被清除马上吗?我知道我可以用另一种方法来调试这个(也就是使用console.log或通过其他方式记录问题)，我只是对为什么这个错误消失感兴趣。

HTML: 

<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>Volume of a Sphere Calculator</title>
    <!--[if lt IE 9]>
    <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
    <link rel="stylesheet" href="css/styles.css">
</head>
<body>
    <!-- sphere.html -->
    <form action="" method="post" id="theForm">
        <fieldset>
            <p>Use this form to calculate the volume of a sphere.</p>
            <div>
                <label for="radius">Radius</label>
                <input type="text" name="radius" id="radius" required></div>
            <div>
                <label for="volume">Volume</label>
                <input type="text" name="volume" id="volume"></div>
            <div>
                <input type="submit" value="Calculate" id="submit"></div>
        </fieldset>
    </form>
    <script src="js/sphere.js"></script>
</body>
</html>

JS: 

function calculate() {
    'use strict';
    var volume;
    var radius = document.getElementById('radius');
    if (radius && (radius.value > 0)){
        volume = (4/3) * Math.PI * Math.pow(radius.value, 3);
    }
    volume = volume.toFixed(4);
    document.getElementById('volume').value = volume;
    return false;
}
function init() {
    'use strict';
    var theForm = document.getElementById('theForm');
    theForm.onsubmit = calculate;
}
window.onload = init;

因为这是我的console.log输出出现并迅速消失的问题的最佳Google匹配，所以发生在我身上的这种情况可能是因为我有一组空白的标签标记不合适，或者表单没有任何操作。删除这些标签会导致JavaScript和console.log()正常工作

添加另一个解决方案作为谷歌搜索"javascript日志消失"带我到这里。

页面刷新/导航出现问题。

根据mateuszb的评论在控制台设置中选择"保存日志"解决了这个问题。

因为undefined没有方法toFixed，它会抛出一个错误，阻止Calculate到达return false;

由于从未到达该行，因此表单提交，这(通常来说)将表单发布到同一页面。

当页面重新加载时，控制台被重置(我相信这取决于特定的浏览器)。

要解决这个问题，将volume初始化为0。

可以使用el.preventDefault();在回调函数

相关文章：