Chrome 控制台上的独立“未捕获”警报

Question

我是 HTML、CSS 和 JavaScript 编码的新手，所以如果我的代码混乱和/或不正确，请原谅我。

我正在尝试制作一个网站，可以帮助情绪低落的人，并且在第一页，我添加了一个输入框，询问用户的姓名，然后将在下一页阅读。 例如，如果我输入“Henry”，下一页应该说“Hello，Henry！” 为了读取下一页中的变量，我使用了 sessionStorage 和 sessionStorage.getItem("inputVal")。 但是，由于某种原因，当我尝试在第一页中记录变量 (inputVal) 时，控制台会给出一个错误，在加载到下一页时清除之前短暂显示“未捕获”。 然后，当我尝试在下一页记录 inputVal 时，控制台只打印“null”。 我搜索了许多表格，但找不到任何可以解决我的问题的方法！ 我是否写错了 sessionStorage，还是我还缺少其他东西？ 这是我的第一个文件的代码：

 <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="main.css">
    <title>Feel Happy</title>
</head>
<body>
    <b class="welcometofeelhappy">Welcome to FeelHappy :)</b>
    <input type="text", id="whatisyourname", placeholder="Please enter your name!", class="whatisyournameinput" required><br>
    <form action="pages/landing.html">
            <button class="startBtn", type="submit", id="btn1", onclick="getInputValue()"><h2 class="buttontext1">Let's Begin!</h2></button>
    </form>
    <script>
        function getInputValue(){
            var inputVal = document.getElementById("whatisyourname").value;
            console.log(inputVal)
            sessionStorage("inputVal", inputVal)
        }
    </script> 
</body>
</html>

第二个文件的代码：

 <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>

    <button onclick="getName()" type="button">Click Me!!</button>

    <script>

        function getName() {
            var inputVal = sessionStorage.getItem("inputVal")
            console.log(inputVal)
        }
        
    </script>

</body>
</html>

注意：出于测试目的，我在控制台中放置了一个打印代码的按钮。

Answer 1

sessionStorage("inputVal", inputVal)不是您将内容写入会话存储的方式。 sessionStorage本身不是一个函数，它是一个提供方法的对象，例如setItem 。

你需要sessionStorage.setItem("inputVal", inputVal) 。

在调试方面，您的浏览器控制台几乎可以肯定地配置为在页面转换后保留日志，即使您离开发生错误的页面，您也可以看到错误消息。

Chrome 控制台上的独立“未捕获”警报

问题描述

1 个解决方案

解决方案1
-1 2022-06-22 04:50:51

Chrome 控制台上的独立“未捕获”警报

问题描述

1 个解决方案

解决方案1 -1 2022-06-22 04:50:51

解决方案1
-1 2022-06-22 04:50:51