停止使用 JavaScript 制作表单来重新加载页面
javascriptweb developmentobject oriented programming更新于 2025/9/24 15:40:17
假设我们需要实现的是当用户提交此 HTML 表单时,我们在客户端处理提交事件并防止浏览器在表单提交后立即重新加载
HTML 表单
<form name="formcontact1" action="#"> <input type='text' name='email' size="36" placeholder="Your e-mail :)"/> <input type="submit" name="submit" value="SUBMIT" onclick="ValidateEmail(document.formcontact1.email)" /> </form>
现在,最简单、最可靠的方法是调整我们的 ValidateEmail() 函数,在其定义顶部包含以下行 −
function ValidateEmail(event, inputText){
event.preventDefault();
//其余功能逻辑放在这里
}
preventDefault() 的作用是告诉浏览器阻止其默认行为,让我们在客户端本身处理表单提交事件。
完整的 HTML 代码是 −
示例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<form name="formcontact1" action="#">
<input
type='text'
name='email'
size="36"
placeholder="Your e-mail :)"/>
<input
type="submit"
name="submit"
value="SUBMIT"
onclick="ValidateEmail(document.formcontact1.email)"
/>
</form>
<script>
{
function ValidateEmail(event, inputText){
event.preventDefault();
//其余功能逻辑放在这里
}
}
</script>
</body>
</html>
相关文章
有用资源
javascript 参考教程 - 该教程包含有关 javascript 的更多信息:https://www.cainiaomax.com/javascript/
打印
下一节:在 JavaScript 中使用 for 循环将数组的每个元素与特定字符连接起来 ❯❮ 上一节:在 JavaScript 中,我有什么方法可以在 initValidation() 函数之外调用validate() 函数吗?

