• 表单填写需要验证可用插件 jQuery Validate
  • 提交数据使用 Ajax 可操控性得到提到

注意:请自行引入 jQuery 和 jQuery Validate


HTML 代码

<form class="icmxform" id="testForm" method="get" action="index.html">
<fieldset>
<legend>输入您的名字,邮箱,URL,以及备注。</legend>
<p>
<label for="iname">Name (必填, 最小两个字符)</label>
<input id="iname" name="name" minlength="2" type="text" required>
</p>
<p>
<label for="iemail">E-Mail (必填)</label>
<input id="iemail" type="email" name="email" required>
</p>
<p>
<label for="icurl">URL (可选)</label>
<input id="icurl" type="url" name="url">
</p>
<p>
<label for="iccomment">备注 (必填)</label>
<textarea id="iccomment" name="comment" required></textarea>
</p>
<p>
<input class="submit" type="submit" value="Submit">
</p>
</fieldset>
</form>

Js 代码

$.validator.setDefaults({
submitHandler: function() {
alert("此处可执行提交数据 Ajax!");
// 可以在处理使用 Ajax 提交表单
}
});

Form 表单用 Ajax 提交数据并用 jQuery Validate 验证的更多相关文章

  1. jquery序列化form表单使用ajax提交后处理返回的json数据

    1.返回json字符串: /** 将一个字符串输出到浏览器 */ protected void writeJson(String json) { PrintWriter pw = null; try ...

  2. 微信小程序--获取form表单初始值提交数据

    <form bindsubmit="formSubmit"> <view class="txt"> <view class=&qu ...

  3. jquery序列化from表单使用ajax提交返回json数据(使用struts2注解result type = json)

    1.action类引入struts2的"json-default"拦截器栈 @ParentPackage("json-default") //示例 @Paren ...

  4. 关于form表单或者Ajax向后台发送数据时,数据格式的探究

    最近在做一个资产管理系统项目,其中有一个部分是客户端向服务端发送采集到的数据的,服务端是Django写的,客户端需要用rrequests模块模拟发送请求 假设发送的数据是这样的: data = {'s ...

  5. jQuery实现form表单基于ajax无刷新提交方法详解

    本文实例讲述了jQuery实现form表单基于ajax无刷新提交方法.分享给大家供大家参考,具体如下: 首先,新建Login.html页面: <!DOCTYPE html PUBLIC &quo ...

  6. Django框架 之 Form表单和Ajax上传文件

    Django框架 之 Form表单和Ajax上传文件 浏览目录 Form表单上传文件 Ajax上传文件 伪造Ajax上传文件 Form表单上传文件 html 1 2 3 4 5 6 7 <h3& ...

  7. 防止表单提交时刷新页面-阻止form表单的默认提交行为

    最近在写 ajax 提交的时候遇到一个问题,在执行 ajax 提交之后,浏览器页面自动刷新了,主要是没有 由于form 表单的默认提交行为.一下是几种阻止 form 表单默认提交行为的方式. 1.使用 ...

  8. form表单的ajax验证2

    form表单的ajax验证2: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"&g ...

  9. laravel中form表单,ajax传值没反应

    laravel中form表单,ajax传值没反应时,可能是令牌有问题. form中添加: {{csrf_token()}} ajax中添加: data: {'page': page, '_token' ...

随机推荐

  1. 浅谈CSS的模块化

    一.简介 Web前端模块化:HTML模块化.CSS模块化以及JS模块化三个部分: 二.CSS模块化背景 对于小型项目来说,css的量还不至于庞大,问题没有凸显,而如果要开发和持续维护一个较为大型的项目 ...

  2. cdh平台问题

    问题背景:内容的不懂之处,可以私信博主.友好交流使用.主要针对的问题种类有:网络桥接报错.网卡文件问题(该问题主要看你的安装脚本文件里面写的是否和主机对应,也是运行环境的问题).scm表中没有节点信息 ...

  3. Hive-多分隔符

    ROW FORMAT SERDE 'org.apache.hadoop.hive.contrib.serde2.MultiDelimitSerDe' WITH SERDEPROPERTIES (&qu ...

  4. MyBatis框架 课程笔记

    MyBatis框架 课程笔记   第1章 MyBatis简介 1.1 MyBatis历史 1)MyBatis是Apache的一个开源项目iBatis, 2010年6月这个项目由Apache Softw ...

  5. spring boot 整合activemq

    1 Spring Boot与ActiveMQ整合 1.1使用内嵌服务 (1)在pom.xml中引入ActiveMQ起步依赖 <properties> <spring.version& ...

  6. nginx下载安装和虚拟机的配置

    一. Nginx下载安装 1.Nginx下载:nginx-1.13.0.tar.gz,下载到:/usr/local/software/ wget http://nginx.org/download/n ...

  7. [LeetCode] 39. 组合总和

    题目链接 : https://leetcode-cn.com/problems/combination-sum/ 题目描述: 给定一个无重复元素的数组 candidates 和一个目标数 target ...

  8. 【ES6】对象的新功能与解构赋值

    ES6 通过字面量语法扩展.新增方法.改进原型等多种方式加强对象的使用,并通过解构简化对象的数据提取过程. 一.字面量语法扩展 在 ES6 模式下使用字面量创建对象更加简洁,对于对象属性来说,属性初始 ...

  9. 结构体指针,C语言结构体指针详解

    结构体指针,可细分为指向结构体变量的指针和指向结构体数组的指针. 指向结构体变量的指针 前面我们通过“结构体变量名.成员名”的方式引用结构体变量中的成员,除了这种方法之外还可以使用指针. 前面讲过,& ...

  10. AutoTikv简介

    AutoTikv是一个用于对TiKV数据库进行自动调优的工具.它的设计灵感来自于SIGMOD 2017的一篇paper:Automatic Database Management System Tun ...