html submit没有提交数据

叁歲伎倆 2021-11-22 12:52 446阅读 0赞

### 一、现象描述 ###

如下从bootstrap示例登录页面参考的原生html代码，由于没有name属性导致表单数据没有提交：

<form class="form-signin"  method="POST" action="/login/">
        
        <h1 class="h3 mb-3 font-weight-normal">Please sign in</h1>
        <label for="username" class="sr-only">Email address</label>
        <input type="text" id="username" class="form-control" placeholder="用户名：" required>
        <label for="password" class="sr-only">Password</label>
        <input type="password" id="password" class="form-control" placeholder="密码：" autocomplete="off" required>
        <div id="compare_result"><font color="red">{
       { error }}</font></div>
        <div class="checkbox mb-3">
          <label>
            <input type="checkbox" value="True" name="remember-me"> 记住我
          </label>
        </div>
        <button class="btn btn-lg btn-primary btn-block" type="submit" id="sub">登录</button>
        <p class="mt-5 mb-3 text-muted">© 2019-2020</p>
      </form>

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2EyMDA4MjIxNDYwODU_size_16_color_FFFFFF_t_70]

### 二、问题解决 ###

在html input标签中加入name属性，表单数据就可以正常提交了。

<form class="form-signin"  method="POST" action="/login/">
        
        <h1 class="h3 mb-3 font-weight-normal">Please sign in</h1>
        <label for="username" class="sr-only">Email address</label>
        <input type="text" id="username" **name="username"**  class="form-control" placeholder="用户名：" required>
        <label for="password" class="sr-only">Password</label>
        <input type="password" id="password" **name="password"** class="form-control" placeholder="密码：" autocomplete="off" required>
        <div id="compare_result"><font color="red">{
       { error }}</font></div>
        <div class="checkbox mb-3">
          <label>
            <input type="checkbox" value="True" name="remember-me"> 记住我
          </label>
        </div>
        <button class="btn btn-lg btn-primary btn-block" type="submit" id="sub">登录</button>
        <p class="mt-5 mb-3 text-muted">© 2019-2020</p>
      </form>

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2EyMDA4MjIxNDYwODU_size_16_color_FFFFFF_t_70 1]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2EyMDA4MjIxNDYwODU_size_16_color_FFFFFF_t_70]: /images/20211122/1dadcfa4689c4ccdb13db16b1b387e66.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2EyMDA4MjIxNDYwODU_size_16_color_FFFFFF_t_70 1]: /images/20211122/a9373a79049d483798a39c325c241935.png