表单JS提交 onsubmit 检查有两个函数 该怎么写？

最新推荐文章于 2021-12-11 14:46:17 发布
最新推荐文章于 2021-12-11 14:46:17 发布
阅读量765 收藏
点赞数
文章标签： js onsubmit
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/sinat_16664531/article/details/102893528
版权
本文介绍了一个在HTML表单中使用JS进行onsubmit事件检查的示例，包括验证input字段的完整性和合理性，以及如何实现验证码功能来防止垃圾留言。通过创建和比较验证码，只有当用户输入正确的验证码时，表单才能成功提交。
摘要由CSDN通过智能技术生成

<form action="../chengducar.php" method="post" class="form" onSubmit="return check(this)">


<input type="text" id="input">  <input type="button" id="code" οnclick="createCode()" /><br />
            <input type="submit" value="submit" class="submit" />
        </form>

check ()是检查input完整和合理性的函数：
<script>function check(){var name=document.getElementById("name");if(name.value==''){alert('Pls fill this');name.focus();return false}else{var vname=(/^[a-zA-Z\u4e00-\u9fa5]{2,30}/);if(!vname.test(name.value)){alert('Pls fill this');name.focus();return false}}var email=document.getElementById('

最低0.47元/天 解锁文章
sinat_16664531
关注
onsubmit阻止form表单提交与onclick的相关操作
09-05
在网页开发中，表单（form）是收集用户输入数据的重要组件，而表单的提交行为可以通过JavaScript进行控制，以实现验证、交互等高级功能。`onsubmit` 和 `onclick` 是两个关键的事件处理器，它们分别在表单提交和按钮...
JavaScript阻止表单提交方法（附代码）
10-19
本文将详细介绍两种阻止表单提交的方法，并解释`onSubmit`和`check()`的区别。 ### 第一种方法：利用event的阻止默认事件机制 这种方法通过在事件处理函数中使用`event.preventDefault()`来阻止表单的默认提交行为...
js的onsubmit支持两方法
bbheguifang的专栏
01-15 811
onsubmit="return (checkForm() && submit_()):"
onsubmit 判断是表单是否提交
qq_30850691的博客
01-04 483
//---> function checksubmit() {   if (document.form1.myname.value=="")         {            alert("请输入开始数值！");            document.form1.myname.focus();            return false;         }   
html5表单提交触发js,JS表单提交中onsubmit事件return的作用
weixin_33570610的博客
06-23 1198
完整代码如下：1.html1 html>2 3 4 JS表单提交中onsubmit事件return的作用5 6 7 8 9 提交10 11 12 1314 15functionCheckname(){16varname=document.getElementById('name').value;17if(!name){18...
表单的提交onsubmit事件
不忘初心，才能始终
06-04 2888
看代码 留个记录： function func(){ alert('false'); return false; } this.form.submit(); //绕过onsubmit事件验证直接提交表单 this.form.onsubmit(); //调用form
onsubmit表单提交简单使用
见证自己学习,成长的记录
06-29 3681
一般表单判断哪些为必填项或者正则时候都会用到onsubmit函数,主要是通过返回的true或者false而进行执行,这里简单说下判断表单属性非空提交 onsubmit只能表单上使用,提交表单前会触发, onclick是按钮等控件使用, 用来触发点击事件。 在提交表单前，一般都会进行数据验证，可以选择在submit按钮上的onclick中验证,也可以在onsubmit中验证。 但是onclick比onsubmit更早的被触发。 提交过程 1、用户点击按钮 —-> 2、触发onclick事件 —->
在一个form用一个SUBMIT(或button)分别提交到两个处理表单页面的代码
10-31
然而，在某些特定情况下，我们可能需要仅使用一个提交按钮(submit或button)来将表单数据同时提交到两个不同的处理页面。这种方式在需要将相同的数据同步到不同系统或服务时特别有用。 ### 知识点一：HTML 表单...
js防止表单重复提交的两种方法
10-26
在提交表单之前，通过一个函数checkSubmit来检查这个标志变量的值。如果发现变量已经被设置为true，则表示表单已经提交过一次，函数将返回false阻止这次提交；如果是第一次提交，函数允许提交并同时将标志变量设置为...
form表单中action和onsubmit的表单检查区别
yingfeng612的专栏
09-23 1801
onsubmit和action两个都是提交时触发的不过：onsubmit是在表单中的确认按钮被点击时触发的，一般是js函数，而action是在按钮被点击之后触发的，一般是触发前台提交到后 台的请求，而引起后台的回应。
[微信小程序]同时发出多个请求时的问题
CosecantY的博客
12-11 3012
在项目里做到了这么一个需求，同时发出多个请求，并在所有结果都接收到时跳转界面。 使用到了Promise.all方法来处理，直接看代码。 //存储promise对象的数组 let promiseArr = []; //将图片地址的上传的promise对象加入到promiseArr for (let i = 0; i < imageList.length; i++) { let promise = new Promise((resolve, reject) => { //这里可以写
防止表单提交按钮多次提交的办法
freshlover的专栏
07-03 1万+
防止表单提交按钮多次提交的办法 如果表单是通过onsubmit进行Ajax提交，注意将表单提交按钮input type属性设为button，尽量不要设置为submit类型。 另外，在提交事件发出后，最好将提交按钮设置为disabled，防止由于网络延时问题，让用户有机会进行多次点击重复提交。 如果使用jQuery的话，只需要在onsubmit函数中的开始位置加一句：$("#subm
form表单的多种提交方式及提交前验证
热门推荐
qq_42128262的博客
06-21 2万+
以下是本人总结处来的一些form的提交方式，网上还有别的提交方式，这里我总结了大小分为7类，其实就是三类的提交方式，若有哪里不对的，还请评论指出来，大家一起学习学习 1、无任何验证提交（最普通的提交） 该方式不提供任何的验证方式，当我们点击提交时（提交的前提一定是 <input> 的type="submit"或者加粗样式<button>的type=“submit”） for...
提交表单之前对表单进行检查的方法 onsubmit="return checkSubmit();"
自强不息
12-01 509
&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt; &lt;html xmlns="http://www.w3.org/1999/xhtml"&gt; &lt;head&gt; &lt;met
JS中关于onSubmit中return的作用
fd214333890的专栏
09-16 2万+
在写表单处理的时候，经常会用到onSubmit事件，而onSu
提交的表单内部需要提交文件，该怎么解决这两次的提交
最新发布
09-10
如果你在网页表单中需要让用户上传文件，并且担心用户可能会误点击导致多次提交，你可以采取以下几个步骤来处理： 1. **取消默认提交**：在表单元素上设置`onsubmit="return false;"`属性，阻止表单的默认提交行为。 ```html <form id="uploadForm" onsubmit="return submitForm(event);"> ... </form> ``` 然后定义 `submitForm` 函数： ```javascript function submitForm(e) { e.preventDefault(); // 阻止表单直接提交 if (validateFiles()) { // 验证文件后再进行提交 // 执行实际提交操作 uploadFile(); } } function validateFiles() { // 这里检查文件是否已选择以及验证内容等 } ``` 2. **按钮触发提交**：将提交操作绑定到单独的一个按钮上，而不是表单自身。当用户确认并点击这个按钮时，再进行文件上传。 ```html <button type="button" onclick="submitForm()">上传</button> ``` 3. **显示反馈信息**：在用户开始上传之前，提供一个明确的提示，如“正在上传，请勿重复点击”。 通过上述措施，可以有效地避免无意间的多次提交。同时别忘了对用户的上传行为进行适当的限制和验证，比如大小、格式等。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值