jquery submit()不能提交表单的解决方法

今天写表单提交的时候需要增加一个确认提示,所以没有使用submit按钮提交,改用jq的submit(),然后问题了

<form method="post" action="https://www.jb51.net/@Url.Action("Edit")"> <div> <div> <div> <div> <h5>添加</h5> </div> <div> <div> <label>开始时间:</label> <div> <span> @(Model.annualRate_beginDate?.ToString("yyyy-MM-dd")) </span> </div> </div> <div> <label>结束时间:</label> <div> <input type="text" value="@Model.annualRate_endDate.ToString("yyyy-MM-dd")" required> </div> </div> <div> <label>年利息%:</label> <div> <input type="number" step="0.01" value="@Model.annualRate_rate.ToString("#0.00")" required> </div> </div> <div> <div> <button type="button"> 提交 </button> <a href="https://www.jb51.net/@Url.Action(" Index")"> 取消 </a> </div> </div> </div> </div> </div> </div> </form>

<script type="text/javascript"> $(function () { $("#submit").click(function () { var start = '@(Model.annualRate_beginDate?.ToString("yyyy-MM-dd"))'; var end = $("#annualRate_endDate").val(); var val = $("#annualRate_rate").val(); layer.confirm('请确认所填写的信息是否正确?<br/>开始时间:' + start + '<br/>结束时间:' + end + '<br/>年利率:' + val, { icon: 3, title: '提示' }, function (index) { $("#form").submit(); layer.close(index); }); }); }) </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改了就没问题了

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wypjgx.html