用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. 四种常用的通知类型(xml)

    1.maven依赖 <?xml version="1.0" encoding="UTF-8"?> <project xmlns="h ...

  2. Qt读写文件

    1.头文件 #include<QFile> #include<QFileDialog> #include<QDataStream> 2.写代码前工作 在ui界面拖入 ...

  3. SP7258 SUBLEX - Lexicographical Substring Search - 后缀自动机,dp

    给定一个字符串,求本质不同排名第k小的子串 Solution 后缀自动机上每条路径对应一个本质不同的子串 按照 TRANS 图的拓扑序,DP 计算出每个点发出多少条路径 (注意区别 TRANS 图的拓 ...

  4. Linux 下安装 java

    yum 安装java 配置环境 /etc/profile export JAVA_HOME=/usr/lib/jvm/java-1.8.0-openjdk-1.8.0.242.b08-0.el7_7. ...

  5. linux安装最新(任意)版本nodejs

    首先在终端中使用命令 uname -a 查看系统版本 uname -a x86_64 是64位的 所以要安装64位对应的nodejs 打开nodejs中文网里的下载 找到64位的文件 点击后就下载了 ...

  6. powerdesigner两数据库对比

    1. powerdesigner两数据库对比 1.1. 问题 position属性不一致,但这并不影响两数据库的结构,我们不需要把它当警告显示出来 1.2. 解决办法

  7. Spark kafka flume

    Flume Flume 是一个分布式.可靠.和高可用的海量日志聚合的系统,支持在系统中定制各类数据发送方,通过监控整个文件目录或者某一个特定文件,用于收集数据:同时Flume也 提供数据写到各种数据接 ...

  8. DSP定点与浮点计算

    在定点DSP芯片中,采用定点数进行数值运算,其操作数一般采用整型数来表示.一个整型数的最大表示范围取决于DSP芯片所给定的字长,一般为16位或24位.显然,字长越长,所能表示的数的范围越大,精度也越高 ...

  9. LeetCode 938. 二叉搜索树的范围和

    题目链接:https://leetcode-cn.com/problems/range-sum-of-bst/ 给定二叉搜索树的根结点 root,返回 L 和 R(含)之间的所有结点的值的和. 二叉搜 ...

  10. 题解【洛谷P1596】[USACO10OCT]Lake Counting

    题面 \(\text{Flood Fill}\) 模板题. \(\text{Flood Fill}\) 可以快速求出一个图中连通块的个数. 大概就是遍历每一个点,如果它没有被遍历过且是一个新连通块,那 ...