用submit来提交表单，然后在js中监听submit方法，用ajax提交表单最后阻止submit的自动提交。

在标准浏览器中，阻止浏览器默认行为使用event.preventDefault()，而在IE6~8中，使用returnValue属性来实现。

<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(event) {

            $.ajax({

                ......

            });

            //阻止submit表单提交

            event.preventDefault();

            //或者return false

            //return false;

        });

    </script>

</body>

</html>

用html5自带表单验证 并且用ajax提交的解决方法(附例子)的更多相关文章

  1. [H5表单]html5自带表单验证体验优化及提示气泡修改

    慕课网之前录制的视频,js/jquery各种宽高的理解和应用,最近终于上线了.还有一个html5左侧导航没有上线!最近慕课网系列课程让我录制一个html5表单验证的课程.今天就稍微说一下表单验证!另外 ...

  2. html5自带表单验证

    起因:今天无意中发现chrome的input框自带表单验证!于是就去试试firefox,惊奇的发现也有自带的验证提示,只不过两者的样式不一样 chrome中的样子: firefox中的样子: 发散:具 ...

  3. html5自带表单验证-美化改造

    神奇的代码 暂且叫做html5.css /* === HTML5 validation styles === */ .myform select:required, .myform input:req ...

  4. discuze回放提示“抱歉,您的请求来路不正确或表单验证串不符,无法提交”

    不知从哪里看到文章,但是实用: 背景:discuze就单纯的录制一个注册脚本,日志中没有报错,在报告中就提示"抱歉,您的请求来路不正确或表单验证串不符,无法提交"",以下 ...

  5. H5自带表单验证

    HTML5自带的表单验证 转载:https://www.web-tinker.com/article/20781.html HTML5对表单元素提供了patern属性,它接受一个正则表达式.表单提交时 ...

  6. HTML5 web Form表单验证实例

    HTML5 web Form 的开发实例! index.html <!DOCTYPE html> <html> <head> <meta charset=&q ...

  7. HTML5新增的表单验证功能

    一.HTML5表单的特点: HTML5 表单增加了许多内置的控件和控件属性 XHTML 中需要放在 form 之中的诸如 input/button/select/textarea 等标签元素,在 HT ...

  8. JS表单验证插件(支持Ajax验证)

    自己编写了一个表单验证插件,支持ajax验证,使用起来很简单. 每个需要验证的表单元素下面有一个span标签,这个标签的class有一个valid表示需要验证,如果有nullable则表示可为空:ru ...

  9. 表单验证—html5新特性表单验证

    一.表单 <body> <section id="register"> <div><img src="images/logo.j ...

随机推荐

  1. 纪中9日T4 2298. 异或

    2298. 异或 (File IO): input:gcdxor.in output:gcdxor.out 时间限制: 1000 ms  空间限制: 262144 KB  具体限制 题目描述 Sarv ...

  2. 数据结构(集合)学习之List

    集合 框架关系图: Collection接口下面有三个子接口:List.Set.Queue.此篇是关于List<E>的简单学习总结. 补充:HashTable父类是Dictionary,不 ...

  3. IDEA 在debug模式下启动慢或者无法启动解决

    参考:https://www.cnblogs.com/han-1034683568/p/8603588.html 背景 这两天在开发项目的时候发现用debug模式启动项目的时候,项目启动速度非常慢甚至 ...

  4. Postman测试上传MultipartFile文件

    单个文件上传 后台代码 //导入excel @PostMapping("/import") public Result excelImport( @RequestParam(&qu ...

  5. 用友UAP NC 单据节点_打开参照字段的问题_从打不开参照放大镜_到成功打开了但是取不到值_到修复成功

    项目的这个功能是17年开发的,但是当时没有测试通过,今年拿出来测试(通过后会上线). 有两个表数据一开始只打算用来计算时查询,没打算放到目标单据中做表体参照字段.后来改细节问题后放到目标单据中做参照字 ...

  6. Linux学习笔记：磁盘分区

    本文更新于2019-12-30.操作系统为Debian 8.9 (jessie). 以下假设新磁盘为/dev/sdb,要创建一个分区/dev/sdb1,文件系统类型为xfs.请根据实际情况,自行选择. ...

  7. c基本语法和数据类型

    一.C语言结构 C 程序主要包括以下部分: 预处理器指令 函数 变量 语句 & 表达式 注释 二.基本语法 1.  分号是语句结束符. 2. 单行注释//.多行注释/* */. 3. 标识符是 ...

  8. Maven的作用

    Maven的作用 1.在开发中,为了保证编译通过,我们会到处去寻找jar包,当编译通过了,运行的时候,却发现"ClassNotFoundException",我们想到的是,难道还差 ...

  9. 小白月赛22 F: 累乘数字

    F:累乘数字 考察点: 思维,高精度 坑点 : 模拟就 OK 析题得侃: 如果你思维比较灵敏:直接输出这个数+ d 个 "00"就行了 当然,我还没有那么灵敏,只能用大数来搞了 关 ...

  10. Mysql分库分表导出导入和数据量统计测试

    需求:添加创建了分库分表后,业务可能将数据已经写入,但未来得及接入到otter汇总库.接入汇总库前需要初始化这部分数据. 1.导出 ip_port_list ) len=${#ip_port_list ...