• 表单填写需要验证可用插件 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. 使用 java.util.Properties 读取配置文件中的参数

    配置文件格式 如下的配置参数格式都支持: Key = ValueKey = Key:ValueKey :Value 用法 getProperty方法的返回值是String类型. //读取配置文件 Fi ...

  2. xmake v2.2.2, 让C/C++拥有包依赖自动构建

    前言 历经四个多月,xmake终于更新了新版本v2.2.2,并且上线了重量级功能:原生支持的远程依赖包管理. 而这个特性,其实我陆陆续续写了将近一年的时间,才初步完成,对于此特性的开发进展和历史,有兴 ...

  3. 如何将/etc/issue文件中的内容转换为大写后保存至/tmp/issue.out文件中

    cat /etc/issue|tr '[:lower:]' [:upper:] >> /tmp/issue.out

  4. Java基础语法-运算符

    1算术运算符 1.1运算符和表达式 运算符:对常量和变量进行操作的符号. 表达式:用运算符把常量或者变量连接起来符合java语法的式子就可以称为表达式. 不同运算符链接的表达式体现的是不同类型的表达式 ...

  5. 第四周Java作业及总结

    写一个名为Rectangle的类表示矩形.其属性包括宽width.高height和颜色color,width和height都是double型的,而color则是String类型的.要求该类具有: (1 ...

  6. Linux命令学习之两个小技巧(1)

    本篇主要想讲两个小技巧.本来技巧之类的话应该放在学完整个东西之后或者在学习中遇到时再说的,但是这两个技巧其实很简单,很多人只要我一提就知道了.与其说是技巧,不如说是注意事项. 自动补全 在Linux终 ...

  7. window-tree命令

    tree 以图形方式显示在驱动器中的目录结构或磁盘的路径. 有时候需要整理文档目录时,而文件太多,一个个去写相应的文件目录结构也不现实,就用到了window下的tree命令 语法 tree [< ...

  8. Paper Reading

    Paper Reading_SysML Paper Reading_Computer Architecture Paper Reading_Database Paper Reading_Distrib ...

  9. 【React -- 4/100】 生命周期

    生命周期 概述 意义:组件的生命周期有助于理解组件的运行方式,完成更复杂的组件功能.分析组件错误原因等 组件的生命周期: 组件从被创建到挂载到页面中运行,再到组件不在时卸载的过程 生命周期的每个阶段总 ...

  10. js常见的设计模式一

    1.观察者模式 定义一些一对多的关系,将一系列的观察者对目标函数感兴趣,将自己添加进目标函数,当目标函数状态发生改变时,发送通知,以此通知附加在目标上的观察者 /* 目标 */ class subje ...