jquery submit()不能提交表單的解決方案

標籤：url   dex   hit   ref   pos   int   ima   title   資訊   

 今天寫表單提交的時候需要增加一個確認提示，所以沒有使用submit按鈕提交，改用jq的submit()，然後問題了

<form class="form-horizontal m-t" method="post" action="@Url.Action("Edit")" id="form">        <div class="row">            <div class="col-sm-12">                <div class="ibox float-e-margins">                    <div class="ibox-title">                        <h5>添加</h5>                    </div>                    <div class="ibox-content">                        <div class="form-group">                            <label class="col-sm-3 control-label">開始時間：</label>                            <div class="col-sm-8">                                <span>                                    @(Model.annualRate_beginDate?.ToString("yyyy-MM-dd"))                                </span>                            </div>                        </div>                        <div class="form-group">                            <label class="col-sm-3 control-label">結束時間：</label>                            <div class="col-sm-8">                                <input type="text" class="form-control" name="annualRate_endDate" id="annualRate_endDate" onclick="laydate({ istime: false, format: ‘YYYY-MM-DD‘ })" value="@Model.annualRate_endDate.ToString("yyyy-MM-dd")" required>                            </div>                        </div>                        <div class="form-group">                            <label class="col-sm-3 control-label">年利息%：</label>                            <div class="col-sm-8">                                <input type="number" step="0.01" class="form-control" id="annualRate_rate" name="annualRate_rate" value="@Model.annualRate_rate.ToString("#0.00")" required>                            </div>                        </div>                        <div class="form-group">                            <div class="col-sm-4 col-sm-offset-2">                                <button class="btn btn-lg btn-primary" id="submit_btn" type="button">                                    提交                                </button>                                <a class="btn btn-lg btn-white" href="@Url.Action("Index")">                                    取消                                </a>                            </div>                        </div>                    </div>                </div>            </div>        </div>    </form>

 1 <script type="text/javascript"> 2     $(function () { 3         $("#submit").click(function () { 4             var start = ‘@(Model.annualRate_beginDate?.ToString("yyyy-MM-dd"))‘; 5             var end = $("#annualRate_endDate").val(); 6             var val = $("#annualRate_rate").val(); 7             layer.confirm(‘請確認所填寫的資訊是否正確？<br/>開始時間：‘ + start + ‘<br/>結束時間：‘ + end + ‘<br/>年利率:‘ + val, { icon: 3, title: ‘提示‘ }, function (index) { 8                 $("#form").submit(); 9                 layer.close(index);10             });11         });12     })13 </script>

點擊提交按鈕出現確認提示，但是確認後就沒反應了

但是將button的type改為submit卻又能提交

於是上jQuery API尋找原因，看到以下這段文字頓時明白了：

Additional Notes:

Forms and their child elements should not use input names or ids that conflict with properties of a form, such as submit, length, or method. Name conflicts can cause confusing failures. For a complete list of rules and to check your markup for these problems, see DOMLint.

大概意思是表單和其子項目不宜用一個表單的屬性的屬性作為name或id的名稱，如submit, length, 和 method等，否則會產生衝突，名稱衝突可能就會導致這種情況。

原來是因為按鈕id設為了submit

接下來只要將id改了就沒問題了

jquery submit()不能提交表單的解決方案