logo标签列表

如何从POST请求中向HTML表单URL添加内容

javascripthtmlhttp-post
3

我希望能够使用HTML表单中的一个字段来修改操作URL。我已经按照这个问题所示的方式进行了GET请求，但是在将技术应用于POST请求时遇到了麻烦。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>User location lookup</title>
    </head>

    <body>
        <!-- method: https://dev59.com/C2bWa4cB1Zd3GeqPbuqD -->

        <script>
            function process()
            {
                var url="http://localhost:43/" + document.getElementById("url").value;
                location.href=url;
                return false;
            }
        </script>

        <form onSubmit="return process();" method="get">
            Username: <input type="text" name="url" id="url"></input>
            <input type="submit" value="go"></input>
        </form>

        <script>
            function process2()
            {
                var url="http://localhost:43/" + document.getElementById("url").value;
                location.href=url;
                return false;
            }
        </script>

        <form method="post"  onSubmit="return process2();">
            Username: <input type="text" name="url" id="url"> </input>
            Location: <input type="text" name="location" id="location"> </input>
            <input type="submit" value="go"></input>
        </form>
    </body>
</html>

GET请求正确地发送：

GET /brian HTTP/1.1
Accept: text/html, application/xhtml+xml, */*
Accept-Language: en-GB
User-Agent: Mozilla/5.0 (Windows NT 6.3; WOW64; Trident/7.0; rv:11.0) like Gecko
Accept-Encoding: gzip, deflate
Host: localhost:43
DNT: 1
Connection: Keep-Alive

对于 POST 请求我收到了以下内容：

GET /brian HTTP/1.1
Accept: text/html, application/xhtml+xml, */*
Accept-Language: en-GB
User-Agent: Mozilla/5.0 (Windows NT 6.3; WOW64; Trident/7.0; rv:11.0) like Gecko
Accept-Encoding: gzip, deflate
Host: localhost:43
DNT: 1
Connection: Keep-Alive

即使方法是POST，仍然使用的是GET方法。

我想要生成的内容是：

POST /brian HTTP/1.1
Accept: text/html, application/xhtml+xml, */*
Accept-Language: en-GB
User-Agent: Mozilla/5.0 (Windows NT 6.3; WOW64; Trident/7.0; rv:11.0) like Gecko
Accept-Encoding: gzip, deflate
Host: localhost:43
Content-Length: 11
DNT: 1
Connection: Keep-Alive

location=SO

有人能帮我指明方向吗？最好使用尽可能少的JavaScript代码。

1个回答
7

您的代码没有提交表单，而是直接通过GET调用URL，即：此方法仅适用于GET。

请尝试：

<form id="myformid" method="post">
    Username: <input type="text" name="url" id="url2" onChange="updateAction()"> </input>
    Location: <input type="text" name="location" id="location"> </input>
    <input id="mysubmit" type="submit" value="go"></input>
</form>

<script>
    function updateAction() {
        var url = document.getElementById("url2").value;
        document.getElementById("myformid").setAttribute("action", "http://localhost:43/" + url);
    }
</script>
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接