HTML表单帖子& / Javascript表单提交

时间:2017-12-20 07:01:25

标签: javascript html

我有一段时间磕磕绊绊:

<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我也尝试了按钮,但它不会以同样的方式工作...... 单击按钮时控制台出错:

  

无法阅读属性&#39;提交&#39;为null

我也尝试过提交按钮,但它似乎并不想工作......我尝试在不同的div之前和之后尝试不同的表单位置,相应地更改按钮位置但没有...

编辑:在JSFiddle中尝试它似乎工作,但在我的代码中它不会。是否有可能在表单之前的另一个div损害了按钮的工作?

2 个答案:

答案 0 :(得分:0)

您忘了将name属性添加到form。   如果我理解正确的话,W3C规范要求每个表单输入元素都指定了name属性。否则将不处理该元素。

 document.suckers.submit();

Look at here .

答案 1 :(得分:0)

在你的用例中你真的需要javascript来提交表单吗? 为什么你没有使用type="submit"

像这样

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

这没有任何问题

如果你必须使用javascript,请记住getElementById或任何选择器确实从文档顶部到底部工作

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