javascript阻止form表单自动提交的方法

女爷i 2021-12-04 02:49 721阅读 0赞

## JavaScript中，阻止form表单自动提交的方法有两种： ##

（1） **使用preventDefault()**  
在标准浏览器中，阻止浏览器自动提交form表单的默认行为使用event.preventDefault()。  
而在IE6 - 8中，使用returnValue属性来实现。

<form action="" method="post">
    	<input type="text" name="username" >
    	<input type="password" name="password" >
    	<input type="submit" value="Submit" id="submit" >
    </form>
    
    <script>
    var btn = document.getElementById("submit");
    btn .onclick = function (event) {
    	alert("preventDefault!");
    	var event = event || window.event;
    	event.preventDefault(); // 兼容标准浏览器
    	window.event.returnValue = false; // 兼容IE6 - 8
    	};
    </script>

（2） **使用return false**  
使用return false同样也可以阻止form表单提交

<form action="" method="post">
    	<input type="text" name="username" >
    	<input type="password" name="password" >
    	<input type="submit" value="Submit" id="submit" >
    </form>
     
    <script>
    var btn = document.getElementById("submit");
    btn .onclick = function (event) {
    	alert("preventDefault!");
    	return false;
    };
    </script>

发表评论取消回复

表情：

评论列表（有 0 条评论，721人围观）

还没有评论，来说两句吧...

相关阅读

相关 ajax提交时表单自动提交，阻止表单的默认提交事件

一、问题描述在改版pc一个动态发布页面的时候页面使用的form表单提交页面数据其中在页面中有一个人员选择的搜索按钮按钮上绑定了点击事件触发ajax !...

逃离我推掉我的手/ 2024年04月17日 17:39/ 0 赞/ 71 阅读

相关 js提交form表单方法

方法一：JS判断提交 js函数 <table> <tbody> <tr> <td> <p>1</p> <p>2</p> <p>3</p> <p>4</

左手的ㄟ右手/ 2024年03月16日 17:50/ 0 赞/ 49 阅读

相关 html中form表单提交和阻止表单提交的细节

[如何阻止表单提交][Link 1] [HTML禁止表单提交方法][HTML] ![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10

朱雀/ 2022年11月25日 00:35/ 0 赞/ 828 阅读

相关 html禁止form表单提交表单提交,onsubmit阻止表单提交

在实际开发中往往会遇到检查表单数据的合法性，如果数据不合法，就不让其提交。 Bootstrap 实例 - 提交表单验证 //---> function checksubm

骑猪看日落/ 2022年10月07日 11:57/ 0 赞/ 425 阅读

相关 onsubmit=return false阻止form表单提交javascript

return false 阻止表单提交不起今天这个问题困扰了我很久，在网上找了很多资料，基本上关于οnsubmit=return false有以下几点要注意的地方： 1

骑猪看日落/ 2022年07月12日 14:28/ 0 赞/ 252 阅读

相关 onsubmit=return false阻止form表单提交javascript

return false 阻止表单提交不起今天这个问题困扰了我很久，在网上找了很多资料，基本上关于οnsubmit=return false有以下几点要注意的地方： 1

小咪咪/ 2022年07月12日 14:28/ 0 赞/ 244 阅读

相关阻止form表单提交按钮的默认 action

$(document).ready(function(){ $("form").submit(function(e){ e.preven

川长思鸟来/ 2022年06月11日 05:58/ 0 赞/ 267 阅读

相关 javascript阻止form表单自动提交的方法

JavaScript中，阻止form表单自动提交的方法有两种：（1）使用preventDefault() 在标准浏览器中，阻止浏览器自动提交form表单的默认行为

女爷i/ 2021年12月04日 02:49/ 0 赞/ 722 阅读

相关阻止form表单submit提交

近日在做项目的时候部分需要用到表单验证，原本想用插件进行验证的，结果发现只需要验证一个地方，就想自己用js写一下，过程中发现一个问题，在验证错误的时候需要点击submit时无法

爱被打了一巴掌/ 2021年09月26日 05:34/ 0 赞/ 479 阅读

相关 Javascript提交form表单

1.使用<a>标签提交表单 <form action="1.html" method="post" id="form"> <input type="text

淩亂°似流年/ 2021年06月24日 14:37/ 0 赞/ 725 阅读