表单的序列化ajax
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="../js/jquery-1.4.2.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#ajaxbutton").click(function(){
//表单序列化 他返回的是字符串
//var data = $("#form1").serialize();
//序列化成三个数据对象
var data = $("#form1").serializeArray();
alert(data);//alert:只能打印字符串,数字,并不能打印很全面信息
console.info(data);
//输出数组
for(var i=0;i<data.length;i++){
alert(data[i].name+" : "+data[i].value);
}
var option ={
"url" :"/jquery_day02/FormServlet",
"data":data,
"type":"POST",
"success":function(data){
//用于接受服务器响应的数据
} }; $.ajax(option);
});
}); </script> </head>
<body>
<h3>表单</h3>
<form id="form1">
<table border="1" >
<tr id="tr1">
<td class=""><label>姓名</label></td>
<td><input type="text" name="username" value="jack" /></td>
</tr>
<tr>
<td class=""><span>密码</span></td>
<td><input type="password" name="password" value="1234" /></td>
</tr>
<tr>
<td><input type="button" value= "异步提交表单" id="ajaxbutton"/></td>
</tr> </table>
</form> <h3>公告信息</h3>
<div>
未满18慎进
</div> </body>
</html>
表单的序列化ajax的更多相关文章
- Form表单提交,Ajax请求,$http请求的区别
做过前端同学想必都避免不了要和后台server打交道.而以下这三种与后台交互的方式想必大家都不陌生. Form表单提交,Ajax请求,Angular的$http请求 以前一直搞不清楚什么时候应该用哪种 ...
- 使用ajax提交form表单,包括ajax文件上传 转http://www.cnblogs.com/zhuxiaojie/p/4783939.html
使用ajax提交form表单,包括ajax文件上传 前言 使用ajax请求数据,很多人都会,比如说: $.post(path,{data:data},function(data){ ... },&qu ...
- 使用ajax提交form表单,包括ajax文件上传【转载】
[使用ajax提交form表单,包括ajax文件上传] 前言 转载:作者:https://www.cnblogs.com/zhuxiaojie/p/4783939.html 使用ajax请求数据,很多 ...
- 第一百八十六节,jQuery,验证表单插件,Ajax 表单插件,验证和提交表单
jQuery,验证表单插件,Ajax 表单插件,验证和提交表单 HTML <form id="reg" method="post" action=&quo ...
- form表单提交与ajax消息传递
form表单提交与ajax消息传递 1.前后端传输数据编码格式contentType: urlencoded 对应的数据格式:name=xxx&password=666 后端获取数据:requ ...
- 关于ajax提交表单参数序列化和时间戳转换
ajax提交form表单, 序列化表单的参数 //var a = $("#addfm").serialize(); //将表单的内容序列化成为一个字符串 var a = $(&qu ...
- 另类的表单数据"序列化"
背景:最近在做项目时,由于编辑页面需要提交的数据量有些多,而且在提交前还需要做一些逻辑处理,所以如果按照正常的方式,一个个的获取值然后拼接json对象传到后台的话相对工作量较大,而且容易出错,后期的维 ...
- 使用ajax提交form表单,包括ajax文件上传
前言 使用ajax请求数据,很多人都会,比如说: $.post(path,{data:data},function(data){ ... },"json"); 又或者是这样的aja ...
- JavaScript之form表单的序列化和json化[form.js]
一.应用场景 form提交时,使用ajax提交. 二.效果 通过本工具,实现表单所有form的快速序列化和json化,使前端人员在ajax提交form表单的时,脱离重复性的,大劳动量的手动抽取form ...
随机推荐
- BOM基础(四)
最近写的文章感觉内容不像之前那么充实,内容可能也有点杂.对于DOM,和BOM来说,要理解是不难的,难的是做的时候.要自己想的到,而且,对于目前阶段来说,BOM还存在着很大的兼容性问题,最主要就是要兼容 ...
- MySQL分区表的局限和限制
禁止构建 分区表达式不支持以下几种构建: 存储过程,存储函数,UDFS或者插件 声明变量或者用户变量 可以参考分区不支持的SQL函数 算术和逻辑运算符 分区表达式支持+,-,*算术运算,但是不支持DI ...
- Android学习总结(十五) ———— Notification(状态栏通知)基本用法
一.Notification基本概念 Notification是一种具有全局效果的通知,它展示在屏幕的顶端,首先会表现为一个图标的形式,当用户向下滑动的时候,展示出通知具体的内容.我们在用手机的时候 ...
- a中的类型转换
自动类型转换 当然自动类型转换是需要满足特定的条件的: 1. 目标类型能与源类型兼容,如 double 型兼容 int 型,但是 char 型不能兼容 int 型. 2. 目标类型大于源类型,如 ...
- 九度OJ题目1076:N的阶乘 (java)运用BigInteger的例子。
题目描述: 输入一个正整数N,输出N的阶乘. 输入: 正整数N(0<=N<=1000) 输出: 输入可能包括多组数据,对于每一组输入数据,输出N的阶乘 样例输入: 4 5 15 样例输出: ...
- CoreAnimation 图层几何学
CoreAnimation 图层几何学 博客园MakeDown支持不佳,如有需要请进GitHub 图层几何所讲主要是有关图层的位置,尺寸等几何类属性. 布局 在UIView中与位置,尺寸有关的属性有 ...
- MySQL查询语句的45道练习
一.设有一数据库,包括四个表:学生表(Student).课程表(Course).成绩表(Score)以及教师信息表(Teacher).四个表的结构分别如表1-1的表(一)~表(四) ...
- Caliburn.Micro - 框架搭建
简介:Caliburn.Micro是Caliburn的一个轻量级版本开源架构,可以用于wpf,sliverlight,wp7等,和注重模块化的Prism比起来也有许多优点,具体比较可以参考 此文 ht ...
- 3.java的hello word.继承.泛型.反射.配置项.数据库操作.lombok
迷迷茫茫的开始了第一步.弄个hello word.结果这第一小步也不是那么的顺利. 明明照着图敲的.可就是没有运行选项. 为此还百度了一下.也没有什么答案.最后只能老老实实的看了.结果还是粗心的问题. ...
- 百度推送-sitemap-使用playframework框架实现-java
主动推送的目的是能够把我们高质量内容推送给百度,但是首先你得有一个属于你自己的网站,在百度站长进行验证通过之后,才有资格推送百度sitemap. 百度站长平台为未使用百度统计的站点提供三种验证方式:文 ...