Django中用JavaScript通过锚点提交表单无法发送POST请求

我尝试用JavaScript提交表单，但后端接收到的是GET请求，而我期望的是POST请求。相关代码及日志如下：

HTML代码 #

<form id="my_form" method="post">
    {% csrf_token %}
    {{form.as_p}}
    <input type="number" name="conf" >
    <a onclick="document.getElementById('my_form').submit();" href="{% url 'signup' 0 %}">ارسال کد</a>
    <br><br>
    <button type="submit">ثبت نام</button>
</form>

控制台日志 #

"GET /signup/0 HTTP/1.1" 200 1531

期望输出 #

"POST /signup/0 HTTP/1.1" 200 

解决方案 #

问题出在<a>标签的默认行为上。点击该链接时，虽然触发了form.submit()发起POST请求，但<a>标签自带的跳转（向href指定URL发送GET请求）没有被阻止，最终浏览器执行了GET跳转，导致你看到的是GET请求日志。

有两种解决方式：

• 方式一：阻止<a>标签的默认跳转行为
  修改onclick事件，添加阻止默认行为的逻辑：

  <a onclick="document.getElementById('my_form').submit(); return false;" href="{% url 'signup' 0 %}">ارسال کد</a>
  

  或者更标准的写法：

  <a onclick="event.preventDefault(); document.getElementById('my_form').submit();" href="{% url 'signup' 0 %}">ارسال کد</a>
  

• 方式二：用按钮替代<a>标签
  触发表单提交用按钮更符合语义，也不会有默认GET跳转问题：

  <button type="button" onclick="document.getElementById('my_form').submit();">ارسال کد</button>
  

修改后，点击"ارسال کد"就只会触发表单的POST提交，后端就能收到预期的POST请求了。

内容的提问来源于stack exchange，提问作者mehdi_ahmadi