单击提交按钮时会发生什么

What happens when submit button is clicked? Let I've a form which located on an http://example.com/ URL with the two input elements like this:

点击提交按钮会发生什么?让我有一个位于http://example.com/网址上的表单,其中包含两个输入元素,如下所示:

<form method="get">
    <input type="text" id="field1" name="namefield1"/>
    <input type="text" id="field2" name="namefield2"/>
    <input type="submit" value="submit"/>
</form>

What actually get request will be sent to an http-server in my specific case?

在我的特定情况下,实际获得请求的内容将被发送到http服务器?

2 个解决方案

#1

The form will be submitted to the server and the browser will redirect away to the current address of the browser and append as query string parameters the values of the input fields.

表单将提交给服务器,浏览器将重定向到浏览器的当前地址,并将查询字符串参数作为输入字段的值附加。

In terms of the HTTP protocol the following GET request HTTP request will be sent:

在HTTP协议方面,将发送以下GET请求HTTP请求:

GET http://example.com/?namefield1=value1&namefield2=value2 HTTP/1.1
Host: example.com

Since your <form> is missing an action attribute, the browser will simply redirect to the current url by appending the values as query string parameters. So if this form was loaded from http://example.com/foo.php after submitting it, the browser will redirect to http://example.com/foo.php?namefield1=value1&namefield2=value2 where value1 and value2 will be the values enetered by the user in the corresponding input fields.

由于

Also you might use your browser's built in debugging tools or Fiddler to inspect the exact payload that gets sent to the server.

您也可以使用浏览器的内置调试工具或Fiddler来检查发送到服务器的确切有效负载。

#2

If you submit the form with a method of 'get' then it will perform a get request thus sending the data held within your input elements on the query string as a name value pair. So for example http://example.com/index.html?field1=joe&field2=bloggs

如果您使用'get'方法提交表单,那么它将执行get请求,从而将查询字符串中输入元素中保存的数据作为名称值对发送。例如http://example.com/index.html?field1=joe&field2=bloggs

See example here if you scroll down to the Submit Button example at the bottom: http://www.w3schools.com/html/html_forms.asp

如果您向下滚动到底部的Submit Button示例,请参阅此处的示例:http://www.w3schools.com/html/html_forms.asp

#1