用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. 50元求解pyqt加载并显示pdf问题

    50块钱求解决pyqt5加载pdf文档并显示,类似briss软件的效果

  2. Android实战项目——家庭记账本（四）

    今天是开发的第四天,完成的主要内容如下: 1.账单查询功能的完善以及查询结果的显示和编辑 2.侧边栏布局的实现 3.首页fragment中本月与上月对比账目情况 实现的效果如图: 已添加的账单内容以及 ...

  3. oracle数据库应用开发经验

    l  日志表应该以时间做分区,方便清理 一般应用都会有一些表用来记录用户操作日志,数据变更记录,交易流水等日志型的库表.这些表最好按时间字段做分区,这样在迁移或者清理历史记录时会比较方便,借助orac ...

  4. stm32f103vct6外扩sram芯片

    STM32F103是一款高性价比.多功能的单片机,配备常用的32位单片机片外资源,基于ARM Cortex-M3的32位处理器芯片,片内具有256KB FLASH,48KB RAM ( 片上集成12B ...

  5. IP后面带/30 /29 /27等是什么意思?

    那个代表你网络的位数,也就是能判断子网掩码.比如30 说明就是11111111.11111111.11111111.11111100 (30个1,2个0)然后转换成十进制就是255.255.255.2 ...

  6. 学习R语言的一点小心得

    1.目前R 语言处于入门阶段吧,能够执行一些简单的模型了,还是有收获的. 但是在跑模型的时候经常遇到各种各样的错误,最常见的错误就是数据带入模型之后,数据的类型不对,因此模型跑不下去,因此说,利用he ...

  7. PHP0011：学生信息管理案例

    PHP中 html js 混合用

  8. 拦截器——原理（AOP、责任链模式、配置）

    1.Struts2拦截器概述: (1)Struts2框架封装中封装了很多功能,这些功能其实都是封装在Struts2的拦截器里面,Struts2里面有很多拦截器,每次不是这些拦截器都执行,每次只执行默认 ...

  9. centos-python3.5安装

    python版本:Python-3.5.5.tgz tar -xvf Python-3.5.5.tgz cp Python-3.5.5 /usr/local cd /usr/local/Python- ...

  10. windows 2012 r2怎么进入本地组策略

    可以使用命令行或使用 Microsoft 管理控制台 (MMC) 打开本地组策略编辑器.通过命令行打开本地组策略编辑器的步骤单击“开始”,在“开始搜索”框中键入 gpedit.msc,然后按 Ente ...