ajax提交表单数据不跳转

前端之家收集整理的这篇文章主要介绍了ajax提交表单数据不跳转前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

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>
原文链接:https://www.f2er.com/ajax/161143.html

猜你在找的Ajax相关文章