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

骑猪看日落 2022-10-07 11:57 447阅读 0赞

在实际开发中往往会遇到检查表单数据的合法性，如果数据不合法，就不让其提交。

Bootstrap 实例 - 提交表单验证

//--->

function checksubmit()

\{

// var input\_data = $("\#form1").serialize();

var data\_arr = $("\#form1").serializeArray();

$.each(data\_arr, function(i, val)\{

// alert(val); //返回对象

// alert(i);

// alert(val.name); // 返回数组元素名字

// alert(val.value); // 返回数组元素的值

if(val.name == "email")

\{

if(val.value == "")

\{

alert("邮件不能为空！");

$("\#email").focus();

return false;

\}

\}

if(val.name == "password")

\{

if(val.value == "")

\{

alert("PWD不能为空！");

$("\#pwd").focus();

return false;

\}

\}

\});

return false;

\}

//--->

Email

Password

Remember me

Sign in

代码很简单。

![bVCG2E?w=663&h=283][bVCG2E_w_663_h_283]

注意以下几点：

1.

其中，将false换成一个检验输入是否合法的函数，该函数返回false或true，则可以在函数返回false的时候阻止表单提交。

2.οnsubmit="return checksubmit()" 这里的return不能省掉。

3.checksubmit()函数里面的return true;可以省去，因为默认是返回true;

一个简单的测试页面：

获取用户Token

//--->

function checksubmit() \{

// var input\_data = $("\#form1").serialize();

var user\_id = $("\#name").val();

if(user\_id < 1)\{

alert("用户ID不能为空！");

$("\#name").focus();

return false;

\}

\}

# 获取TOKEN #

用户ID

placeholder="请输入用户ID">

提交

$user\_id = (int)$\_GET\['user\_id'\];

if($user\_id > 0)

\{

$sql = "select \* from user\_tbl where user\_id = \{$user\_id\} limit 0,10";

$ret = db\_query($sql);

if(empty($ret))

\{

dump('没有该用户的设备Token记录！');

\}else

\{

dump($ret);

\}

\}

?>

![bVFkKd?w=626&h=355][bVFkKd_w_626_h_355]

[bVCG2E_w_663_h_283]: https://segmentfault.com/img/bVCG2E?w=663&h=283
[bVFkKd_w_626_h_355]: https://segmentfault.com/img/bVFkKd?w=626&h=355

发表评论取消回复

表情：

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

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

相关阅读

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

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

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

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

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

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

相关表单提交 onsubmit="return false"

一般，后台程序员与表单打交道的时间是最多的。最近在看老师考试系统的源码，看到了有这么一段代码，当时不是很理解， google寻求帮助。现在来总结一下。

╰半夏微凉°/ 2022年07月19日 00:28/ 0 赞/ 212 阅读

相关 Form表单提交

1. JS源码提交： var form = document.getElementById('AddZookeeperForm'); form

深藏阁楼爱情的钟/ 2022年07月15日 01:42/ 0 赞/ 374 阅读

相关 Form表单提交

1. JS源码提交： var form = document.getElementById('AddZookeeperForm'); form

谁借莪１个温暖的怀抱￠/ 2022年07月15日 01:42/ 0 赞/ 393 阅读

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

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

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

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

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

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

相关 S实现表单内容验证、阻止表单提交（onsubmit）

onsubmit属性只在 `<form>` 表单中使用。 onsubmit事件是当表单提交时进行相关JS操作的一个事件。 onsubmit事件会在表单中的确认按钮被

悠悠/ 2022年05月11日 02:40/ 0 赞/ 410 阅读

相关 html form表单提交验证

function check(){ var name = document.getElementById("name").value; if

红太狼/ 2022年03月28日 15:53/ 0 赞/ 420 阅读

相关阻止form表单submit提交

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

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