# 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表单的更多相关文章

  1. input file 在开发中遇到的问题 类似ajax form表单提交 input file中的文件

    最近在做项目的过程中遇到个问题,在这里做个记录防止日后忘记 现今的主流浏览器由于ajax提交form表单无法把文件类型数据提交到后台,供后台处理,可是开发中由于某些原因又不得不用ajax提交文件, 为 ...

  2. ajax form表单提交 input file中的文件

    ajax form表单提交 input file中的文件 现今的主流浏览器由于ajax提交form表单无法把文件类型数据提交到后台,供后台处理,可是开发中由于某些原因又不得不用ajax提交文件, 为了 ...

  3. 结合Bootbox将后台JSON数据填充Form表单

    本文介绍了如何结合Bootbox将后台JSON数据填充到Form表单中,同时也介绍了一些需要使用的知识的学习途径,并附上了参考文档地址与学习网址,对此感兴趣的伙伴可以直接访问学习.为了方便介绍,使用了 ...

  4. jquery下的提交,点击按钮没反应,post方法不执行 JSON方式在FORM表单下不起作用

    jquery下的提交,点击按钮没反应,post方法不执行 JSON方式在FORM表单下不起作用

  5. 巨蟒python全栈开发django11:ajax&&form表单上传文件contentType

    回顾: 什么是异步? 可以开出一个线程,我发出请求,不用等待返回,可以做其他事情. 什么是同步? 同步就是,我发送出了一个请求,需要等待返回给我信息,我才可以操作其他事情. 局部刷新是什么? 通过jq ...

  6. vue3 element-plus 配置json快速生成form表单组件,提升生产力近600%(已在公司使用,持续优化中)

    ️本文为博客园社区首发文章,未获授权禁止转载 大家好,我是aehyok,一个住在深圳城市的佛系码农‍♀️,如果你喜欢我的文章,可以通过点赞帮我聚集灵力️. 个人github仓库地址: https:gi ...

  7. js 取值&赋值-form表单

      form表单元素介绍 CreateTime--2016年9月22日10:25:54 Author:Marydon <form> 表单元素. 表单中的元素: <input>表 ...

  8. ajax form表单回显

    /* * 表单自动回显js * 依赖JQURY * 使用参考:$("#form1").form("load",{"id":"112 ...

  9. JS解决在提交form表单时某个值不存在 alter弹窗点确定不刷新界面

    <form action="" method="post" onsubmit="return checkname()"> < ...

随机推荐

  1. mysql中UNION ALL用法

    MYSQL中的UNION UNION在进行表链接后会筛选掉重复的记录,所以在表链接后会对所产生的结果集进行排序运算,删除重复的记录再返回结果. 举例说明: select * from table1 u ...

  2. python中del函数的垃圾回收

    今天学习面向对象里的类被del函数的垃圾回收过程搞的晕头转向,经过了老师的讲解还是是懂非懂,然后看了很多博客慢慢的心里才有了个大概的了解. 刚刚看到一篇博客,觉得讲的很好,转载过来以供参考.以下转自笨 ...

  3. (01)JVM-内存三大核心区域以及分析

    package org.burning.sport.jvm; /** *  从JVM调用的角度分析Java程序对内存空间的使用, * 当JVM进程启动的时候,会从类加载器路径中找到包含main方法的入 ...

  4. 【数组】Find Peak Element

    题目: A peak element is an element that is greater than its neighbors. Given an input array where num[ ...

  5. Adobe CC Family 2015 Master 或 Adobe CC Family 2017 Master的安装步骤(图文详解)

    不多说,直接上干货!   你还在为安装PS烦恼吗?你还在为制作视频软件寻找烦恼吗?..... 前言 现在,已经出来了 简单了解, Adobe Acrobat的百度百科: http://baike.ba ...

  6. Python -- 网络编程 -- Socket发送文件

    客户端如果直接send两次,一次发文件名,一次发文件内容 服务端接受的时候会一起接收,不知怎么分开发送,或者分开接收, 或者全部接收再解析内容 今天发现传送mp3文件的时候没问题,传送文本文件的话,以 ...

  7. Nginx配置访问权限

    基于IP配置Nginx的访问权限 Nginx配置通过两种途径支持基本访问权限的控制,其中一种是由HTTP标准模块ngx_http_access_module支持的,通过IP来判断客户端是否拥有对Ngi ...

  8. Ceph 块设备 - 命令,快照,镜像

    目录 一.Ceph 块设备 二.块设备 rbd 命令 三.操作内核模块 四.快照基础 rbd snap 五.分层快照 六.镜像 rbd mirror 七.QEMU 八.libvirt 九.Openst ...

  9. C# WebBrowser设置代理

    WebBrowser控件是基于IE浏览器的,所以它的内核功能是依赖于IE. code: class IEProxy { //设置代理选项 private const int INTERNET_OPTI ...

  10. vue权限路由实现方式总结

    使用全局路由守卫 实现 前端定义好路由,并且在路由上标记相应的权限信息 const routerMap = [ { path: '/permission', component: Layout, re ...