简体   繁体   English

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

[英]why can't I see the form results in html?

I am a beginner at html and I was trying to learn how forms in html works, but as shown in the below code I was not able to get the form results after clicking on submit button.我是 html 的初学者,我试图了解 html 中的 forms 的工作原理,但如下面的代码所示,我在单击提交按钮后无法获得表单结果。 Can you please tell me why its not working and how to fix it?你能告诉我为什么它不起作用以及如何解决它吗?

index.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>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>

result.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>

This is what is displayed on the screen after clicking on submit button这是点击提交按钮后屏幕上显示的内容

${name}: ${value} ${name}: ${value} ${name}:${value} ${name}:${value}

Try Changing form method to POST instead of get尝试将表单方法更改为 POST 而不是 get

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

<input> elements of type submit are rendered as buttons. submit 类型的<input>元素呈现为按钮。 When the click event occurs (typically because the user clicked the button), the user agent attempts to submit the form to the server.当单击事件发生时(通常是因为用户单击了按钮),用户代理会尝试将表单提交给服务器。

Change改变

<button>submit</button>

to

<input type="submit">

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM