ajax提交表單資料不跳轉
阿新 • • 發佈:2018-11-03
1.onsubmit
form表單的onsubmit方法在submit執行之前提交表單
<script type="text/javascript"> function sub() { // jquery 表單提交 $("#formId").ajaxSubmit(function(message) { // 對於表單提交成功後處理,message為返回內容 }); return false; // 必須返回false,否則表單會自己再做一次提交操作,並且頁面跳轉 } </script> <form id="formId" action="servlet" method="post"onsubmit="return sub();"> <input type="submit" value="提交"/> </form>
2.ajax提交
<script type="text/javascript"> function sub() { $.ajax({ cache: true, type: "POST", url:"Servlet", data:$('#formId').serialize(),// 你的formid async: false, error: function(request) { alert("Connection error:"+request.error); }, success: function(data) { alert("SUCCESS!"); } }); } </script> <form id="formId" method="post""> <input id="input1" /> <input id="input2" /> <input id="input3" /> <input type="button" value="提 交" onclick="sub()"/> </form>
注意問題:
button 如果設定為 type="submit",會出現提交兩次的問題,請把submit設定為type="button"