zoukankan      html  css  js  c++  java
  • jquery 序列化form表单

    1.为什么要将form表单序列化?

    ajax上传form表单的原始方式,是将form表单中所需要的键值对先获取,然后再组装成数据(两种方式:http:localhost:8080/test.do?personName=张三&sex=1  /   json的格式),这种方式有大量的form表单中的数据要获取,序列化的方式,只用调用一个方法即可获取上述两种方式的数据。

    2.使用jquery序列化

    <form id="test-form" action=""  >

      <input name="person.name"  value=“张三“>

           <input name="person.sex"  value="1“>

    <!-- 测试被display修饰的元素是否会被序列化 -->

           <input   style="display:none;" name="person.age"  value="1“>

    <!-- 测试没有name属性的元素是否会被序列化 -->

           <input    value="1“>

    </form>

    1.获取url带参数形式的数据

    console.info($("#test-form").serialize() ) ;  //这里是使用jquery序列化的方法。

    序列化之后的结果:“&person.name=张三(这里中文会被编码)&person.sex=1&person.age=1”

    由此可见被display修饰的元素也会被序列化,没有name属性的input框不会被序列化,因为序列化的本质是key-value的形式

    2.获取json对象

    console.info($("#test-form").serializeObject());

    序列化之后的结果:{"person.name":"张三","person.sex":"1","person.age"}

    被display修饰的元素依然会被序列化

    3.select/textarea等元素是否能被序列化?

    未做测试,但是可以写input的隐藏域来代替这是标签

  • 相关阅读:
    学习Karma+Jasmine+istanbul+webpack自动化单元测试
    学习测试框架Mocha
    WebSockets通信
    简单的CSS圆形缩放动画
    css3 实现图片等比例放大与缩小
    CSS3之多列布局columns详解
    scp传输文件的命令
    学习rollup.js模块文件打包
    go语言之进阶篇通过switch实现类型断言
    go语言之进阶篇通过if实现类型断言
  • 原文地址:https://www.cnblogs.com/blogxiao/p/9066209.html
Copyright © 2011-2022 走看看