JS JSON序列化 Ajax form表单
# JS序列化
a = {"k1":"v1"} #序列化为字符串 类似python json.dumps(a)
b = JSON.stringify(a)
"{\"k1\":\"v1\"}" #序列化为字典 类似python json.loads(b)
c = JSON.parse(b)
Object { k1: "v1" } 1.
Python序列化
字符串 = json.dumps(对象) 对象->字符串
对象 = json.loads(字符串) 字符串->对象
JavaScript:
字符串 = JSON.stringify(对象) 对象->字符串
对象 = JSON.parse(字符串) 字符串->对象
应用场景:
数据传输时,
发送:字符串
接收:字符串 -> 对象
2. ajax $.ajax({
url: 'http//www.baidu.com',
type: 'GET',
data: {'k1':'v1'},
success:function(arg){
// arg是字符串类型
// var obj = JSON.parse(arg)
}
})
$.ajax({
url: 'http//www.baidu.com',
type: 'GET',
data: {'k1':'v1'},
dataType: 'JSON',
success:function(arg){
// arg是对象
}
})
$.ajax({
url: 'http//www.baidu.com',
type: 'GET',
data: {'k1':[1,2,3,4]},
dataType: 'JSON',
success:function(arg){
// arg是对象
}
})
发送数据时:
data中的v
a. 只是字符串或数字
$.ajax({
url: 'http//www.baidu.com',
type: 'GET',
data: {'k1':'v1'},
dataType: 'JSON',
success:function(arg){
// arg是对象
}
})
b. 包含属组
$.ajax({
url: 'http//www.baidu.com',
type: 'GET',
data: {'k1':[1,2,3,4]},
dataType: 'JSON',
traditional: true,
success:function(arg){
// arg是对象
}
})
c. 传字典
b. 包含属组
$.ajax({
url: 'http//www.baidu.com',
type: 'GET',
data: {'k1': JSON.stringify({}) },
dataType: 'JSON',
success:function(arg){
// arg是对象
}
})
d.传整个form表单
$(function () {
ajaxsumbit();
}); function ajaxsumbit() {
$("#btn").click(function () {
$.ajax({
url: "ajax1.html",
data: $("#fm").serialize(), # form表单内容
type: "GET",
dataType: "json",
success: function (args) {
console.log(args.username);
console.log(args.passwd);
console.log(args.status);
$("#sp").text(args.status + " " + args.passwd + " " + args.username);
},
error: function () {
alert("error")
}
})
})
}
3. 事件委托 $('要绑定标签的上级标签').on('click','要绑定的标签',function(){}) $('要绑定标签的上级标签').delegate('要绑定的标签','click',function(){}) 4. 编辑
5. 总结 新URL方式:
- 独立的页面
- 数据量大或条目多
对话框方式:
- 数据量小或条目少
-增加,编辑
- Ajax: 考虑,当前页;td中自定义属性
- 页面(***)
删除:
对话框
JS JSON序列化 Ajax form表单的更多相关文章
- input file 在开发中遇到的问题 类似ajax form表单提交 input file中的文件
最近在做项目的过程中遇到个问题,在这里做个记录防止日后忘记 现今的主流浏览器由于ajax提交form表单无法把文件类型数据提交到后台,供后台处理,可是开发中由于某些原因又不得不用ajax提交文件, 为 ...
- ajax form表单提交 input file中的文件
ajax form表单提交 input file中的文件 现今的主流浏览器由于ajax提交form表单无法把文件类型数据提交到后台,供后台处理,可是开发中由于某些原因又不得不用ajax提交文件, 为了 ...
- 结合Bootbox将后台JSON数据填充Form表单
本文介绍了如何结合Bootbox将后台JSON数据填充到Form表单中,同时也介绍了一些需要使用的知识的学习途径,并附上了参考文档地址与学习网址,对此感兴趣的伙伴可以直接访问学习.为了方便介绍,使用了 ...
- jquery下的提交,点击按钮没反应,post方法不执行 JSON方式在FORM表单下不起作用
jquery下的提交,点击按钮没反应,post方法不执行 JSON方式在FORM表单下不起作用
- 巨蟒python全栈开发django11:ajax&&form表单上传文件contentType
回顾: 什么是异步? 可以开出一个线程,我发出请求,不用等待返回,可以做其他事情. 什么是同步? 同步就是,我发送出了一个请求,需要等待返回给我信息,我才可以操作其他事情. 局部刷新是什么? 通过jq ...
- vue3 element-plus 配置json快速生成form表单组件,提升生产力近600%(已在公司使用,持续优化中)
️本文为博客园社区首发文章,未获授权禁止转载 大家好,我是aehyok,一个住在深圳城市的佛系码农♀️,如果你喜欢我的文章,可以通过点赞帮我聚集灵力️. 个人github仓库地址: https:gi ...
- js 取值&赋值-form表单
form表单元素介绍 CreateTime--2016年9月22日10:25:54 Author:Marydon <form> 表单元素. 表单中的元素: <input>表 ...
- ajax form表单回显
/* * 表单自动回显js * 依赖JQURY * 使用参考:$("#form1").form("load",{"id":"112 ...
- JS解决在提交form表单时某个值不存在 alter弹窗点确定不刷新界面
<form action="" method="post" onsubmit="return checkname()"> < ...
随机推荐
- Java之集合(十四)Hashtable
转载请注明源出处:http://www.cnblogs.com/lighten/p/7426522.html 1.前言 HashTable这个类很奇特,其继承了Dictionary这个没有任何具体实现 ...
- Error: java.lang.NullPointerException at outputformat.MysqlOutputFormat.getRecordWriter(MysqlOutputFormat.java:27)
Error: java.lang.NullPointerException at outputformat.MysqlOutputFormat.getRecordWriter(MysqlOutputF ...
- Android 开发工具类 07_ScreenUtils
获得屏幕相关的辅助类: 1.获得屏幕高度: 2.获得屏幕宽度: 3.获得状态栏的高度: 4.获取当前屏幕截图,包含状态栏: 5.获取当前屏幕截图,不包含状态栏. import android.app. ...
- JavaScript -- 运算符、eval、Parse
----- 003-运算符.html ----- <!DOCTYPE html> <html> <head> <meta http-equiv="C ...
- Tomcat配置https、访问http自动跳转至https
1.配置Tomcat,打开$CATALINA_HOME/conf/server.xml,修改如下 <Connector port="8080" protocol=" ...
- svn合并分支到主干
将分支pear_For2.3的最终版本合并到主干pear,操作步骤如下:1.选中主干pear右击-> Team -> 合并,弹出如下所示: 到此分支合并到主干已完成,若代码有冲突需找到冲突 ...
- Go语言学习笔记七: 函数
Go语言学习笔记七: 函数 Go语言有函数还有方法,神奇不.这有点像python了. 函数定义 func function_name( [parameter list] ) [return_types ...
- C++运行时动态类型
RTTI 运行时类型识别(RTTI)的引入有三个作用: 配合typeid操作符的实现: 实现异常处理中catch的匹配过程: 实现动态类型转换dynamic_cast typeid操作符的实现 静态类 ...
- Polymorphic form--多态表单
一个ruby on rails项目,用户和公司的模型都有地址. 我要创建一个地址表,包含用户和公司表的引用,比直接做下去要好一点,这回让我的数据库设计保持干净. 我的第一印象是,这似乎很难实现,外面所 ...
- 【转】外国朋友出的js题目,你能对几道
原文地址 http://perfectionkills.com/javascript-quiz/ 中文地址加解释:by Aaron:http://www.cnblogs.com/aaronjs/p/3 ...