`

[#0x0053] 阻止 form submit 的方法

    博客分类：
  • HTML
HTMLformsubmit 
阅读更多

有两个地方可以可以阻止form submit，一是<form onsubmit="">，而是<form>下的<input type="submit" onclick="">，只要这两个函数有一个是return false;，那么点击这个button并不会submit form。

 

具体的执行流程是这样的：

if (submitInput.onclick() == false) {
	// 不触发 form.onsubmit();
	// form 不提交;
} else {
	// 触发 form.onsubmit();
	if (form.onsubmit() == false) {
		// form 不提交
	} else {
		// 提交 form
	}
}

 

所以在这个两个函数里面可以加一些验证工作，同时，可以根据验证结果来判断是否提交form。

比如有：

var checkForm = function() {
	// 获取输入
	if (校验失败)
		return false；
	else
		return true；
}

 

然后把这个函数写到onsubmit或是onclick，也可以针对不同的button写不同的逻辑的校验函数，比如这样：

<html>
	<form onsubmit="return checkFormStep2();" method="post" action="/XXX.do">
		<input type="text" id="username">
		<input type="password" id="password">

		<input type="submit" onclick="return checkFormStep1();" value="go" />
	</form>
</html>

在点击时先执行checkFormStep1()，在form提交前再执行checkFormStep2()，两个都通过都return true了才提交

 

也可以针对“撤销”功能的按钮写一些类似清空输入的功能，再禁止它提交form，比如这样：

<html>
	<form method="post" action="/XXX.do">
		<input type="text" id="username">
		<input type="password" id="password">

		<input type="submit" onclick="return checkFormStep();" value="go" />
		<input type="submit" onclick="clearInput(); return false;" value="reset" />
	</form>
</html>

 

分享到：
[#0x0051] static属性的注入必须使用非stat ...
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    基于BootstrapValidator的Form表单验证(24)

    group"&gt; &lt;button type="submit" class="btn btn-primary pull-right"&gt;注册&lt;/button&gt; &lt;/div&gt; &lt;/form&gt; &lt;/div&gt;&lt;/body&gt;&lt;/html&gt;0x03 配置验证规则配置验证规则接下来，我们需要在JavaScript中配置验证规则。这里，我们将...

    Ajax 中文乱码问题

    var strA = URLEncoding("submit1=Submit&text1=中文"); var oReq = new ActiveXObject("MSXML2.XMLHTTP"); oReq.open("POST", "http://ServerName/VDir/TstResult.asp", false); oReq.setRequestHeader("Content-...

    浮点vfdsfJAVA实现链表,双向链表.txtJAVA实现链表,双向链表.txt

    &lt;td&gt;&lt;input id="btn_submit" name="" type="image" src="/images/btn_submit.png" /&gt; &lt;!-- upload need to know --&gt; 上传须知 * 如涉及侵权内容,您的资源将被移除 * 请勿...

    2021-2022计算机二级等级考试试题及答案No.19298.docx

    15. HTML 提交数据：在 HTML 中，提交数据通常通过表单元素如 &lt;form&gt;，使用 "submit" 事件，这里答案 B "点击 Button 2" 是正确的，假设 Button 2 的 type 是 "submit"。 16. 剪贴板：Windows98 中的剪贴板是一个...

    奇怪的回车换行问题

    而当使用表单的常规提交（`form submit`）时，回车和换行的编码都在。 这可能与ExtJS内部的`serializeForm`函数有关，该函数负责将表单元素的值编码为URL查询参数格式。它使用了JavaScript内置的`...

    JSP语法-----基础篇

    &lt;input type="submit" name="submit" value="提交"/&gt; &lt;/form&gt; !String s = null;%&gt; &lt;!-- 变量声明 --&gt; 程序片 s = request.getParameter("jcs"); if (s == null) { out.println("您还没有输入, 请输入内容!"); ...

    先锋无组件上传类(无惧2.0杜绝上传漏洞修改版) v2004

    &lt;input type="submit" name="Submit" value="上传" ...&gt;&lt;/form&gt; 用到的变量: filepath 默认值uploadface 属性hiden act　默认值upload　属性hiden file1　就是你要传的那个文件 关键是 filepath 这个变量! ...

    struts2标签

    &lt;s:form action="submitForm"&gt; 输入字段" /&gt; &lt;s:submit value="提交" /&gt; &lt;/s:form&gt; ``` 这将创建一个表单，用户填写"inputField"后点击提交按钮，Struts2会处理表单数据并调用"submitForm"动作。 Struts2标签...

    PHP基础教程 是一个比较有价值的PHP新手教程！

    $a = 0x12; # 十六进制数(等于十进制数的18) $a = 1.234; # 浮点数"双精度数" $a = 1.2e3; # 双精度数的指数形式 字符串 字符串可以由单引号或双引号引出的字段定义。注意不同的是被单引号引出的字符串是以字面...

    php上传图片存入数据库示例分享

    $pdo-&gt;exec("INSERT INTO `upload` (`type`, `data`) values ('$type', 0x$data)"); $id = $pdo-&gt;lastInsertId(); echo 'upload success!$id . '"&gt;View&lt;/a&gt;'; } catch (PDOException $e) { echo $e-&gt;getMessage...

    微软内部资料-SQL性能优化3

    It is up to the application to define what consistency means, and isolation in some form is needed to achieve consistent results. SQL Server uses locking to achieve isolation. Definition of ...

Magicbox
Global site tag (gtag.js) - Google Analytics