最近在写 ajax 提交的时候遇到一个问题,在执行 ajax 提交之后,浏览器页面自动刷新了,主要是没有 由于form 表单的默认提交行为。一下是几种阻止 form 表单默认提交行为的方式。
1.使用button 按钮提交表单的时候,要设置type="button" button在浏览器中默认的类型为submit;
2.使用input 代替button ,设置type="button"
3.event.preventDefault(); 在提交事件绑定的方法的最后 使用event.preventDefault();方法;
4.用onclick点击事件来return false
讲一下表单提交按钮onclick事件:
onclick="return true" ;默认的表单提交事件
onclick="return false";阻止表单提交事件
只需要在onlick 绑定的方法func最后添加return false; 标签中的onclick 属性要写成 onclick="return func();" 一定要加return;
5.利用表单的onsubmit事件
注意:onsubmit事件的作用对象为<form>,所以把onsubmit事件加在提交按钮身上是没有效果的。
form对象的onsubmit事件类似onclick,都是先处理调用的函数,再进行表单是否跳转布尔值的判断
onsubmit="return true" 为默认的表单提交事件
onsubmit="return false"为阻止表单提交事件
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <script> 7 function func(){ 8 return false; 9 } 10 </script> 11 </head> 12 <body> 13 <form action="" onsubmit="return func()"> 14 <input type="submit" value="button" /> 15 </form> 16 </body> 17 </html>标签:onsubmit,return,提交,form,表单,事件,onclick From: https://www.cnblogs.com/LuoCore/p/17206766.html