html5的表单控件提供了很多格式检测功能,可以省去很多烦人的javascript验证代码,例如pattern属性和require属性,但触发的条件是表单提交,如果想通过ajax提交表单,就出现了不能触发验证的问题。

  解决办法就是依然使用 input submit作为提交按钮,但在表单的提交事件里阻止进一步动作,转为ajax发送请求,这里贴出JQuery的代码:

<script language="javascript">
$(document).ready(function(){
$("#form").submit(function(e){
e.preventDefault();
/*-----Ajax省略-------*/
})
})
</script> <form action="..." id="form">
<input type="text" required />
<input type="submit" value="提交" />
</form>

html5表单与Jquery Ajax配合使用的更多相关文章

  1. jQuery html5Validate基于HTML5表单验证插件

    更新于2016-02-25 前面提到的新版目前线上已经可以访问: http://mp.gtimg.cn/old_mp/assets/js/common/ui/Validate.js demo体验狠狠地 ...

  2. 第一百八十六节,jQuery,验证表单插件,Ajax 表单插件,验证和提交表单

    jQuery,验证表单插件,Ajax 表单插件,验证和提交表单 HTML <form id="reg" method="post" action=&quo ...

  3. Form表单利用Jquery Validate验证以及ajax提交

    #表单利用Jquery验证验证以及ajax提交 概述>详细讲解表单利用Jquery >验证验证以及ajax提交的过程,以及Validate的自定义提示语,非空判断,输入字段的远程ajax验 ...

  4. Ideal Forms – 帮助你建立响应式 HTML5 表单

    Ideal Forms 是建立和验证响应式 HTML5 表单的终极框架.它刚刚发布 V3 版本,更小,更快,更具可扩展性.它支持实时验证,完全自适应(适应容器,没有 CSS 媒体查询需要),键盘支持, ...

  5. 15 款优化表单的 jQuery 插件

    网页上的表单提供给用户的一种交互的方式,用户输入数据,提交到服务器,等待后续的处理.这些表单在我们浏览的网页中随处可见,也容易被我们忽略. 比如,“联系我们”页面会提供一个表单给用户填写他们的信息和想 ...

  6. 使用ajax提交form表单,包括ajax文件上传 转http://www.cnblogs.com/zhuxiaojie/p/4783939.html

    使用ajax提交form表单,包括ajax文件上传 前言 使用ajax请求数据,很多人都会,比如说: $.post(path,{data:data},function(data){ ... },&qu ...

  7. 实现跨浏览器html5表单验证

    div:nth-of-type(odd){ float: left; clear: left; } .origin-effect > div:nth-of-type(even){ float: ...

  8. html5 表单样式 表单验证1 2 3

    html5 表单样式 ie9以下不支持 <!DOCTYPE html> <html lang="en"> <head> <meta cha ...

  9. Form表单提交,Ajax请求,$http请求的区别

    做过前端同学想必都避免不了要和后台server打交道.而以下这三种与后台交互的方式想必大家都不陌生. Form表单提交,Ajax请求,Angular的$http请求 以前一直搞不清楚什么时候应该用哪种 ...

随机推荐

  1. 实现ssr服务端渲染demo

    最近在研究SSR服务器端渲染,自己写了的小demo. 项目布局 ├── build // 配置文件 │   │── webpack.base // 公共配置 │   │── webpack.clien ...

  2. .NETCore C# 中级篇2-4 一文带你完全弄懂正则表达式

    .NETCoreCSharp 中级篇2-4 本节内容为正则表达式的使用 简介 有的时候,你是否有过这种需求:判断一个Ip地址.邮箱.密码规则是否合法.如果让你使用if一类的传统方法进行处理,你肯定会被 ...

  3. 洛谷 P1357 花园

    题意简述 一个只含字母C和P的环形串 求长度为n且每m个连续字符不含有超过k个C的方案数 题解思路 由于\(m<=5\)所以很显然状压 但由于\(n<=10^{15}\).可以考虑用矩阵加 ...

  4. Java后台解决跨域问题

    首先说一下什么是跨域? JavaScript出于安全方面的考虑,不允许跨域调用其他页面的对象.那什么是跨域呢,简单地理解就是因为JavaScript同源策略的限制,a.com域名下的js无法操作b.c ...

  5. js全选与取消全选

    实现全选与取消全选的效果 要求1(将军影响士兵):点击全选按钮,下面的复选框全部选中,取消全选按钮,下面的复选框全部取消 思路:复选框是否被选中,取决于check属性,将全选按钮的check属性值赋值 ...

  6. 二级小兵——工厂模式(Factory Method)

    前言 上一篇我们介绍了单例模式,今天给大家讲一个比较简单的模式——工厂模式(Factory Method),工厂模式又是什么呢?顾名思义,工厂——生产制造东西的地方.那么应用在程序当中该如何使用.并且 ...

  7. copy好文“IT34岁危机破解心法”

    在博客园中偶然发现一个好文,收藏并记录以下.在工作中更多的从企业单位用人角度去思考,或许能在职场及职业规划中更加的游刃有余,有的放矢.下面是原文. 本文题目虽是“IT人34岁危机”破解心法,但内容同样 ...

  8. 初学HTML5做的小知识点

    新增的HTML5标签 语义化标签 :<header> 头标签      <nav> 导航标签      <section> 表示文档的结构.栏目      < ...

  9. hibernate 报错com.mysql.jdbc.exceptions.jdbc4.MySQLSyntaxErrorException

    解释:JavaBean的主键类型只能是int类型,因为在映射关系配置是自动增长的,String类型是不能自动增长的,所以会报错.

  10. Java反射使用总结

    最近公司招了几名刚毕业的大学生,在给他们培训的过程中,讲到反射,他们有些人听不懂,对反射的概念云里雾里的,不知道反射有什么用. 因此就有了本文的诞生. 反射是java提供的一个重要功能,可以在运行时检 ...