zoukankan      html  css  js  c++  java
  • JQuery里ajax的表单传值serialize()用法

          本文导读在jQuery中,当我们使用ajax时,常常需要拼装 input数据以键值对(Key/Value)的形式发送到服务器,用JQuery的serialize方法可以轻松的完成这个工作,使用这个方法可以将 表单序列化为键值对(key1=value1&key2=value2…)后提交。下面介绍JQuery中serialize()的用法:

    语法:

    $('form').serialize()

     详细说明

    1、.serialize() 方法创建以标准 URL 编码表示的文本字符串。它的操作对象是代表表单元素集合的 jQuery 对象。

    2、.serialize() 方法可以操作已选取个别表单元素的 jQuery 对象,比如 <input>, <textarea> 以及 <select>。不过,选择 <form> 标签本身进行序列化一般更容易些

    3、只会将”成功的控件“序列化为字符串。如果不使用按钮来提交表单,则不对提交按钮的值序列化。如果要表单元素的值包含到序列字符串中,元素必须使用 name 属性。

     4、form里面的name不能够用 Js、jquery里的关键字。

    首先有一个form表单:

    <form id="form1">
    
       <input name="name" type="text" value="小明" />
    
       <input name="sex" type="text" value="男" />
      <input type="button" id="submit" value="提交" /> </form>
    
    

     通过ajax将表单内容传到后台一般是

        $.ajax({  
                                type: "POST",  
                                data:"name="+$("input[name='name']").val()+"&sex="+$("input[name='name']").val(),  
                                url: "你的方法名",  
                                dataType: "text",  
                                cache: false,  
                                success: function(data){      
                                    if(1==data){  
                                    alert("删除失败!");  
                                    return;  
                                    }else{  
                                    location.reload();   
                                    }  
                                }  
                            });  
    

     这种拼接的data非常的麻烦,那么serialize()就很好的解决这个问题了,

        $.ajax({  
                    type: "POST",  
                    data:$("#form1").serialize(),  //用form的id去找对象 ,也可以使用$('form').serialize(),
                    url: "你的方法名",  
                    dataType: "text",  
                   // cache: false,  
                    success: function(data){      
                        if(data==1){  
                            alert("删除失败!");   
                        }else{  
                            //其他  
                        }  
                    }  
                });  
    

     这样就把form表单序列化过去了,

    传过去会是 name=小明&sex=男 ;

    接下来就可以在后台 继续处理了。


     注:本文由王智磊(王大宝儿)整理编写,也参考借鉴了很多大神的笔记,分享代码,分享成功,欢迎各位交流和转载,转载请注明出处(博客园:王大宝儿)http://www.cnblogs.com/wangzhilei/

  • 相关阅读:
    Bozh 的技术博客 梦想成为Gnu/Linux | Unix后台架构师 | Read the fucking source code
    Welcome to the TANGO website
    repowatcher : about
    PyTango documentation — PyTango 8.0.2 documentation
    Visual Studio 2010旗舰版正式版序列号 civilman的专栏 博客频道 CSDN.NET
    BoostPro Binary Installer for Visual C++
    分享:httping 1.5.6 发布,HTTP 诊断工具
    浅析epoll – epoll函数深入讲解 C++爱好者博客
    分享:Jython动态加载Jar
    News BoostPro Computing BoostPro
  • 原文地址:https://www.cnblogs.com/wangzhilei/p/6627283.html
Copyright © 2011-2022 走看看