为什么我在 html 中看不到表单结果？

Question

我是 html 的初学者，我试图了解 html 中的 forms 的工作原理，但如下面的代码所示，我在单击提交按钮后无法获得表单结果。 你能告诉我为什么它不起作用以及如何解决它吗？

索引.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>html/css</title>
</head>
<body>

   <form action="result.html" method="get">
    <label for="N">Name:</label>
       <input type="text" id="N" name="Name" required>
      <br>

       <label  for="P">Phone number:</label>

       <input type="number" id="P" name="phone_nos" required> 
       <br>

    <button>submit</button>
       <br>
   </form>
</body>
</html>

结果.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>
    <div id="results"></div>
   <a href="/">Go Back</a>
    <script>
        const resultsList = document.getElementById('results')
        new URLSearchParams(window.location.search).forEach(
(value,name)=>{ resultsList.append('${name} : ${value}')
        resultsList.append(document.createElement('br'))
        })
    </script>
</body>
</html>

这是点击提交按钮后屏幕上显示的内容

${name}：${value} ${name}：${value}

Answer 1

尝试将表单方法更改为 POST 而不是 get

--> <form action="result.html" method="post">

Answer 2

submit 类型的<input>元素呈现为按钮。 当单击事件发生时（通常是因为用户单击了按钮），用户代理会尝试将表单提交给服务器。

改变

<button>submit</button>

至

<input type="submit">

为什么我在 html 中看不到表单结果？

问题描述

1 个解决方案

解决方案1
1 2021-11-28 10:35:59

解决方案2
0 2021-11-28 10:25:55

为什么我在 html 中看不到表单结果？

问题描述

1 个解决方案

解决方案1 1 2021-11-28 10:35:59

解决方案2 0 2021-11-28 10:25:55

解决方案1
1 2021-11-28 10:35:59

解决方案2
0 2021-11-28 10:25:55