用html5自带表单验证 并且用ajax提交的解决方法(附例子)
来源:互联网 发布:淘宝掌中宝是什么 编辑:程序博客网 时间:2024/03/29 19:10
一般表单的提交用的都是用button然后用ajax来提交,但是用button就不能触发HTML5的自带表单验证,用submit的话就又会直接提交表单。我百度了一下解决方法:
用submit来提交表单,然后在js中监听submit方法,用ajax提交表单最后阻止submit的自动提交。
我百度到了解决方法但是没有找到简单的Demo,在这里我写了一个简单的Demo附上:
<html><head> <script type="text/javascript" src="jquery-1.9.0.min.js"></script></head><body> <form action="" id='submitform'> username: <br> <input type="text" name="username" value="" required="required"> <br> password: <br> <input type="text" name="password" value="" required="required"> <br><br> <input type="submit" value="Submit"> </form> <script type="text/javascript" language="javascript"> $("#submitform").on("submit", function(ev) { $.ajax({ ...... }); //阻止submit表单提交 ev.preventDefault(); //或者return false //return false; }); </script></body></html>
最后说一下:H5自带的验证只是比较简单的验证,不是很完美,只适合做比较简单的验证。最好是用jQ的Validation插件或者其他表单验证插件。
阅读全文
2 0
- 用html5自带表单验证 并且用ajax提交的解决方法(附例子)
- 用html5自带表单验证 并且用ajax提交的解决方法(附代码)
- 用html5自带表单验证 并且用ajax提交的解决方法(附代码)
- 用html5自带表单验证 并且用ajax提交的解决方法
- html5自带的表单验证
- HTML5自带的表单验证
- html5自带表单验证
- 如何禁用HTML5自带的表单验证功能
- 禁用HTML5自带的表单验证功能
- html5 原生表单验证+ajax 提交
- html5自带表单验证-美化改造
- HTML5表单验证的例子
- ajax的验证提交例子
- HTML5表单及其验证【html自带属性验证】
- 取消IE自带的表单提交
- html5自带属性验证表单必填
- ajax提交带文件的表单
- AJAX提交带附件的表单
- 资讯精选|OfO和北京经信委联合开发出了全国首个电子围栏技术并在北京通州试点
- ARM异常处理
- AIX操作系统及常用命令
- 游戏开发中的人工智能(完):遗传算法
- android.content.ActivityNotFoundException异常
- 用html5自带表单验证 并且用ajax提交的解决方法(附例子)
- poj 2251 Dungeon Master
- Java并发之CountDownLatch、CyclicBarrier和Semaphore
- TCP的三次握手和四次挥手
- 算法-->阶乘
- KMP算法实现
- 数据库查询引擎
- 马云又一大动作_天猫汽车自动贩售机横空出世。
- bzoj1295: [SCOI2009]最长距离