jQuery使用serialize(),serializeArray()方法取得表单数据

• 原始form表单值获取方式(手动)：

   

• $.ajax({
     type: "POST",
     url: "ajax.php",
     data: "Name=摘取天上星&position=IT技术",
     success: function(msg){alert(msg);},
     error: function(error){alert(error);}
   });

• JQ serialize()方法取值：

   

• $.ajax({
     type: "POST",
     url:"ajax.php",
     data:$('#formID').serialize(),// 要提交的表单
     success: function(msg) {alert(msg);},
     error: function(error){alert(error);}
  });
  serialize()序列化表单实例：
  < type="text/" src="jquery-1.9.1.min.js"></>
  < type="text/">
  $(function(){
     $("#button").click(function(){
       alert($("#formID").serialize());
     });
  });
  </>
  <form id="formID">
      姓名 <input value="摘取天上星" name="Name" />
      职位 <input value="IT技术" name="position" />
          <input id="button" value="提交" type="button" />
  </form>

   将form中的值转换为键值对：

   

  // 如：{Name:'摘取天上星',position:'IT技术'}
  // ps:注意将同名的放在一个数组里
  function getFormJson(form) {
  var o = {};
  var a = $(form).serializeArray();
  $.each(a, function () {
  if (o[this.name] !== undefined) {
  if (!o[this.name].push) {
  o[this.name] = [o[this.name]];
  }
  o[this.name].push(this.value || '');
  } else {
  o[this.name] = this.value || '';
  }
  });
  return o;
  }

  键值对方式的AJAX调用：

   

• //调试调用 
  $(function(){
  $("#button").click(function(){
  alert(getFormJson("#formID"));
  });
  });
  //Ajax提交
  $.ajax({
     type: "POST",
     url:"ajax.php",
     data:getFormJson($("#formID")),//表单数据JSON格式的函数参数里填写表单的ID或要提交的表单
     dataType: 'json',
     success: function(msg) {alert(msg);},
     error: function(error){alert(error);}
  });

• 实例中通用的HTML表单：

   

• <form id="formID">
      姓名 <input value="摘取天上星" name="Name" />
      职位 <input value="IT技术" name="position" />
          <input id="button" value="提交" type="button" />
  </form>

  注意： 要提交的表单中必须要要有name 属性，才行，否则是不给你提交的。