jQuery验证阻止表单提交

最新推荐文章于 2023-12-26 14:15:37 发布

xmq_666

最新推荐文章于 2023-12-26 14:15:37 发布

阅读量1.4w

点赞数 1

分类专栏： jQury 文章标签： jquery function html

jQury 专栏收录该内容

13 篇文章 0 订阅

订阅专栏

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gbk">
<script type="text/javascript" src="/sunchis/script/jquery-1.3.2.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(":submit[id=tijiao]").click(function(check){
var val = $(":text[id=test]").val();
if(val==""){
alert("文本框输入为空，不能提交表单！");
$(":text[id=test]").focus();
check.preventDefault();//此处阻止提交表单
}
});
});
</script>
<title>jQuery禁止提交表单</title>
</head>
<body>
<form action="index.htm" method="post">
<input type="text" name="test" id="test">
<input type="submit" id="tijiao" value="提交">
</form>
</body>
</html>

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

xmq_666

关注关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
1
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录

Ajax表单验证失败后，阻止表单提交（jQuery）

qq_42444651的博客

04-21

2052

Ajax表单验证失败后，阻止表单提交（jQuery） HTML界面 '<form action="/WangYiYun/PhoneLogin" id="login_form" class="phone_login_form">' + '<input type="text" id="phone" placeholder="请输入手机号" required="required" ...

jquery 阻止表单的默认提交行为

weixin_59519449的博客

12-02

896

思路：用 e.preventDefault() 阻止表单的默认提交行为 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, i.

1 条评论您还未登录，请先登录后发表或查看评论

jquery实现表单验证并阻止非法提交

10-23

本文给大家分享的是使用jquery实现表单验证并阻止非法提交的代码，思路非常不错，这里推荐给小伙伴们参考下。

Jquery阻止表单提交

经验在于积累而不在于年限---dreamboycx

11-29

425

$(document).ready(function(){ $("form").submit(function(e){ e.preventDefault(); alert("表单阻止提交了"); }); });

js、jQuery阻止表单提交

Areom个人博客

08-04

314

<form action="yourURL" id="form" method="post"> <input name="title" value=""> <input name="nickname" value=""> <button id="submit" onclick="checked()">提交</button></form><script type="text/java

jQuery 禁用表单提交按钮，防止用户请求重复提交

沉默王二

11-29

4575

当页面上有表单的时候，为了防止用户等不及服务器端响应重复点击提交按钮向服务器端发送重复请求，我们通常需要在请求提交之前将提交按钮禁用。先来看一下页面。当用户点击提交申请这个按钮时，我们需要将其禁用。 $("button.btn-submit", $form).attr("disabled","true"); 一般请求结束会遇到两种情况，一种是 success，一种是 error，如果要在这...

在JQuery中阻止表单提交的方式

美奇软件开发工作室

03-11

4543

HTML页面 <form onsubmit="return check()"> jQuery //form提交前验证 function check(){ if(验证条件不通过){ return false; }else{ return true;//不写此返回值也行，此时就直接提交了 } } ...

基于jQuery实现表单提交验证

10-25

如果发现存在任何输入错误，阻止表单提交，并保留错误提示信息。 - 当用户点击重置按钮时，所有相关的提示信息会被清除，表单将恢复到初始状态。通过上述步骤，可以确保表单在提交到服务器之前，所有必填项都被...

jQuery完整注册表单提交验证.zip

07-11

"jQuery完整注册表单提交验证"是一个针对此需求的解决方案，它提供了全面的验证功能，确保用户输入的数据符合预期，同时减少了服务器端的压力。本文将深入探讨jQuery如何实现这一功能，以及如何将其应用于实际项目中...

jQuery中验证表单提交方式及序列化表单内容的实现

12-02

// 阻止表单提交 } return $('#addForm').form('validate'); // 判断required项是否全部有值 }, success: function(data) { var obj = jQuery.parseJSON(data); // 将返回的JSON转化为所需对象 if (!obj....

jquery 阻止表单提交方法

weixin_30501857的博客

08-05

1808

<form name="message_form" action="?m=mobilecenter&c=index&a=service" method="post" onsubmit="javascript:chkservice(this);return false;"></form> function chkservice(From){ var t...

jQuery防止表单提交

筱筱的专栏

09-20

388

当表单中间只有一个元素时，按enter键时，表单会自动提交。如果不想提交 jQuery(function($){ $('#form').keypress(function(e){ if(e.keyCode == 13) { e.preventDefault(); } }); }) form为表单的id，keydown和keypress事件可以 key

jQuery 阻止表单提交

卩杉的博客笔记

11-18

4224

1. 利用 onsubmit="return false" 阻止表单提交 <form action="" method="get" onsubmit="return false"> <input type="text" name="name" value=""> <button

JQuery 阻止外层表单自动提交

哈

04-26

162

对于上图所示的界面，整体上是一个表单，中间的Logo部分，当用户上传文件时，默认情况下会自动打开新的页面，而不是停留在当前的页面，要实现文件上传页面不跳转就需要阻止最外层的表单的跳转。//阻止表单自动提交。

使用JS和JQuery 阻止表单提交的两种方法

dianchamian8747的博客

08-29

288

<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gbk"> <title>JavaScript禁止提交表单</title> <script type="text/javascript"> function ge...

html jquery submit 提交表单,jQuery阻止表单表单submit自动提交

weixin_36450668的博客

06-20

330

‌‌‌‌‌‌‌‍‌‌‌‌‌‌‌‌‌‍‌‌‌‌‌‍‌‌‌‌‌‍‌‌‌‌‌‌‌‌‌‍‌‌‌‌‌‌‌‌‌‌‍‌‌...

jquery原生如何特定的条件里面阻止form表单提交

最新发布

熟悉 vue2 vue3 jquery js echarts

12-26

491

【代码】jquery原生如何特定的条件里面阻止form表单提交。

javaweb验证码的实现与jQuery 的表单阻止

weixin_65749277的博客

04-01

952

1.验证码的实现jQuery与js 实现 var cns = ['q','w','e','r','t','y','u','i','o','p','a','s','d','f','g','h','j','k','l','z','x','c','v','b','n', 'm','M','N','B','V','C','X','Z','A','S','D','F','G','H','J','K','L','P','O','I','U','Y','T','R','E','W','Q', ...

jquery阻止默认行为_jQuery阻止表单默认提交行为后，要继续进行提交行为，怎么做？...

weixin_39811842的博客

12-24

504

jQuery阻止表单默认提交行为后，要继续进行提交行为，怎么做？具体是这样的：一个删除按钮，在提交之前用sweetalert2提示一下，当按下提示框中的“确认”按钮后，继续提交表单。html代码：{{ method_field('DELETE') }}{{ csrf_field() }}js代码：$('.need-alert').on('click', function (event) {//阻止...

jquery表单验证提交

11-29

以下是一个简单的jQuery表单验证和提交的例子： ```html <form id="myform"> <label for="username">用户名：</label> <input type="text" id="username" name="username"><br> <label for="password">密码：</label> <input type="password" id="password" name="password"><br> <input type="checkbox" id="allow" name="allow" checked> <label for="allow">同意协议</label><br> <button type="submit">提交</button> </form> <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script> <script> $(function() { var $username = $('#username'); var $password = $('#password'); var $allow = $('#allow'); var $form = $('#myform'); // 验证用户名 function validateUsername() { var value = $username.val(); if (!value) { alert('用户名不能为空'); return false; } return true; } // 验证密码 function validatePassword() { var value = $password.val(); if (!value) { alert('密码不能为空'); return false; } return true; } // 验证同意协议 function validateAllow() { if (!$allow.prop('checked')) { alert('请同意协议'); return false; } return true; } // 提交表单 function submitForm() { alert('提交成功'); $form.submit(); } // 绑定提交事件 $form.submit(function(event) { event.preventDefault(); // 阻止默认提交行为 if (validateUsername() && validatePassword() && validateAllow()) { submitForm(); } }); }); </script> ``` 该例子中，我们使用jQuery选择器获取表单元素，并定义了三个验证函数：`validateUsername()`、`validatePassword()`和`validateAllow()`，分别用于验证用户名、密码和同意协议是否勾选。在提交表单时，我们通过`event.preventDefault()`阻止了默认的表单提交行为，并在验证通过后调用`submitForm()`函数提交表单。