如何防止表单提交?
我们可以使用 event.preventDefault() 来轻松地防止网页上的表单提交,或在提交事件处理程序上返回 Flase。让我们逐个看示例 −
使用 event.preventDefault() 防止表单提交
要阻止表单提交,请使用 event.preventDefault(),即 −
<form onsubmit="event.preventDefault();">
示例
让我们看一个完整的示例 −
<!DOCTYPE html>
<html>
<body>
<h1>Details</h1>
<form onsubmit="event.preventDefault();">
<p>Select the subject you want to choose:</p>
<div>
<input type="radio" id="prog" name="subject" value="prog">
<label for="prog">Programming</label>
<input type="radio" id="dev" name="subject" value="dev">
<label for="dev">Web Development</label>
<input type="radio" id="db" name="subject" value="db">
<label for="db">Database</label>
</div><br/>
<div>
<button id="submit" type="submit">Submit</button>
</div>
</form>
</body>
</html>
输出
选择任何选项并单击提交按钮。表单不会提交 −
在提交事件处理程序上使用 return false 来防止表单提交
要阻止表单提交,请在提交事件处理程序上使用 return false −
<form onsubmit="return false;">
示例
让我们看一个完整的示例 −
<!DOCTYPE html>
<html>
<body>
<h1>Details</h1>
<form onsubmit="return false;">
<p>Select the subject you want to choose:</p>
<div>
<input type="radio" id="prog" name="subject" value="prog">
<label for="prog">Programming</label>
<input type="radio" id="dev" name="subject" value="dev">
<label for="dev">Web Development</label>
<input type="radio" id="db" name="subject" value="db">
<label for="db">Database</label>
</div><br/>
<div>
<button id="submit" type="submit">Submit</button>
</div>
</form>
</body>
</html>
输出
选择任何选项并单击提交按钮。表单不会提交 −
广告
数据结构
网络
关系型数据库管理系统
操作系统
Java
iOS
HTML
CSS
Android
Python
C 编程
C++
C#
MongoDB
MySQL
Javascript
PHP