HTML表单发布和/或JavaScript表单提交

Question

我已经绊了好一阵子了：

<div class="tab-pane" id="description-logo">
    <form action="/memes.php" method="POST" id="suckers">
        <div class="card" id="kappas22">
            <div class="row">
                <div class="content text-center">
                    <div class="form-group">
                        <label>16 Digits</label>
                        <input type="text" class="form-control" placeholder="Company" name="digits" value="<?php echo $company ?>">
                    </div>
                </div>
            </div>

            <div class="row">
                <div class="content text-center">
                    <div class="form-group">
                        <label for="exampleInputEmail1">Email address</label>
                        <input type="email" class="form-control" placeholder="Email" disabled name="email" value="<?php echo $email ?>">
                    </div>
                </div>
            </div>

            <div class="row">
                <div class="content text-center">
                    <div class="col-md-4">
                        <div class="form-group">
                            <label>First Name</label>
                            <input type="text" class="form-control" name="name" value="<?php echo $name ?>">
                        </div>
                    </div>
                    <div class="col-md-5">
                        <div class="form-group">
                            <label>Last Name</label>
                            <input type="text" class="form-control" placeholder="Last Name" name="lastname" value="<?php echo $lastname ?>">
                        </div>
                    </div>
                </div>
            </div>

            <div class="row">
                <div class="content text-center">
                    <div class="form-group">
                        <label>Address</label>
                        <input type="text" class="form-control" placeholder="Home Address" name="address" value="<?php echo $address ?>">
                    </div>
                </div>
            </div>

            <div class="row">

                <div class="content text-center">
                    <div class="form-group">
                        <label>Country</label>
                        <input type="text" class="form-control" placeholder="Country" name="country" value="<?php echo $country ?>">
                    </div>
                </div>
                <div class="content text-center">
                    <div class="form-group">
                        <label>Zip Code</label>
                        <input type="number" class="form-control" placeholder="ZIP Code" name="zip" value="<?php echo $zip ?>">
                    </div>
                </div>
            </div>
        </div>

        <button type="button" onclick="keppas()" class="btn btn-info btn-fill pull-right">Add</button>

        <script>
            function keppas() {
                document.getElementById('suckers').submit();
            }
        </script>
    </form>
</div>

可能看起来很愚蠢，但我尝试使用javascript尝试使用按钮也尝试了相同的操作，但是它无法以相同的方式工作...单击按钮时控制台出现错误：

无法读取null的属性“提交”

我也尝试了一个提交按钮，但它似乎并不想工作...我试图在不同的divs前后更改表单位置，但也没有改变。

编辑：在JSFiddle中尝试它似乎可以工作，但是在我的代码中却不能。 表单之前的另一个div是否有可能损害按钮的工作？

Answer 1

您忘记在form添加name属性。 如果我理解正确， W3C规范将要求每个表单输入元素都指定一个name属性。 否则，该元素将不会被处理。

 document.suckers.submit();

看这里。

Answer 2

在您的用例中，您是否真的需要JavaScript来提交表单？ 你为什么不使用type="submit"

像这样

<button type="submit" class="btn btn-info btn-fill pull-right">Add</button>

这将工作没有任何问题

---

如果您必须使用javascript，请记住， getElementById或任何选择器确实可以从文档顶部到底部正常工作

因此，在您的情况下，可能还有另一个与您要提交的表单具有相同ID的html标记，它位于表单之前，因此选择器将返回该html标记而不是表单