表单提交按钮未在 MS Edge 上提交任何数据

Question

我的表单脚有两个按钮。第一个应该加载带有使用方法提示的不同页面，第二个触发弹出窗口。第一个只有属性，第二个在点击时绑定了 jquery 事件，这是有效的。但是在 MS Edge 上，第一个按钮加载页面，该页面也在第二个 btn 触发的弹出交互之后加载。这只发生在 Edge 上。它适用于 IE 11、Chrome 和 Firefox。有什么解决办法吗？我错过了什么吗？

<form method="POST" id="start-exam-form" novalidate="novalidate">
                    <input type="hidden" name="csrfmiddlewaretoken" value="nFgf0NGZKushRlwFnTc3AAsB7JFMTAG5">
                    <div class="form-body">
                        <div class="form-row">
                            <label class="form-label">First name *</label>
                            <div class="form-controls">

                                     <input class="field" data-msg-required="*This field is required." data-rule-required="true" id="id_first_name" maxlength="50" name="first_name" placeholder="" type="text" value="martin" aria-required="true">

                             </div><!-- /.form-controls -->

                        </div><!-- /.form-row -->
                        <div class="form-row">
                            <label class="form-label">Last name *</label>
                            <div class="form-controls">

                                     <input class="field" data-msg-required="*This field is required." data-rule-required="true" id="id_last_name" maxlength="50" name="last_name" placeholder="" type="text" value="todorov" aria-required="true">

                            </div><!-- /.form-controls -->

                        </div><!-- /.form-row -->

                         <div class="form-row">
                            <div class="form-controls">
                                <div class="checkbox-wrapper">

                                        <input data-msg-required="*Please confirm your identity." data-rule-required="true" id="id_confirm_identity" name="confirm_identity" type="checkbox" checked="checked" aria-required="true">

                                    <label for="id_confirm_identity">
                                        <span class="checkbox"></span>
                                        <span>I confirm my identity</span>
                                    </label>

                                </div> <!-- /.checkbox-wrapper -->
                            </div> <!-- /.form-controls -->
                        </div> <!-- /.form-row -->

                        <div class="form-row">
                            <div class="form-controls">
                                <div class="checkbox-wrapper">

                                        <input data-msg-required="*Please accept our policy." data-rule-required="true" id="id_is_accepted_terms" name="is_accepted_terms" type="checkbox" checked="checked" aria-required="true">

                                    <label for="id_is_accepted_terms">
                                        <span class="checkbox"></span>
                                        <span>I agree to the <a href="/terms-and-conditions">T&amp;C</a> and <a href="/privacy-policy">Privacy Policy</a></span>
                                    </label>

                                </div> <!-- /.checkbox-wrapper -->
                            </div> <!-- /.form-controls -->
                        </div> <!-- /.form-row -->

                        <div class="form-row">
                            <div class="form-controls">
                                <div class="checkbox-wrapper">
                                    <input id="id_receive_future_job_offers" name="receive_future_job_offers" type="checkbox">
                                    <label for="id_receive_future_job_offers">
                                        <span class="checkbox"></span>
                                        <span>I want to receive future job offers</span>
                                    </label>

                                </div> <!-- /.checkbox-wrapper -->
                            </div> <!-- /.form-controls -->
                        </div> <!-- /.form-row -->
                    </div><!-- /.form-body -->
                    <div class="form-foot">
                        <button name="start_exam_guide_btn" type="submit" form="start-exam-form" class="btn btn-white start-exam-guide-btn" value="start-guide"><span>Exam guide</span></button>
                        <button class="btn btn-green-light start-exam-button"><span>Start Exam</span></button>
                    </div><!-- /.form-foot -->
                </form>

Answer 1

您的 type="submit" 在加载指南的按钮上。所以点击另一个按钮不会做任何事情。

如果您正在使用 bootstrap，并且您看起来是，我会将指南按钮保留为 link 和按钮 class <a class="btn btn-white start-exam-guide-btn" href="<your link"><span>Exam guide</span></a>

并将type="submit"移动到另一个按钮

表单提交按钮未在 MS Edge 上提交任何数据

Form submit button not submitting any data on MS Edge

forms

submit

button

microsoft-edge