jquery序列化元素

 序列化元素:

    做项目的时候,表单是必不可少的,经常用来提交数据,例如注册、登陆等。常规的方法是使表单提交到另外一个页面,整个浏览器都会被刷新,而使用Ajax技术则能够异步地提交表单,并将服务器返回的数据显示在当前页面中。

表单为:

<form id="form1" action="#">
        <p>评论:</p>
        <p>姓名: <input type="text" name="username" id="username" /></p>
        <p>内容: <textarea name="content" id="content"  rows="2" cols="20"></textarea></p>
        <p><input type="button" id="send" value="提交"/></p>
</form>

  <div class='comment'>已有评论:</div>
  <div id="resText" >

为了获取数据,必须将字段的值逐个添加到data参数中,代码如下:

$("#send").click(function(){
            $.get("get1.php", {
                username : $("#username").val();
                content : $("#content").val();
            } , function (data, textStatus){
                alert(textStatus);
                        $("#resText").html(data); // 把返回的数据添加到页面上
                    }
                    );
})

采用序列化的方法为:

$("#send").click(function(){
                $.get("get1.php", $("#form1").serialize() , function (data, textStatus){
                    alert(textStatus);
                        $("#resText").html(data); // 把返回的数据添加到页面上
                    }
                    );
})

 

posted @ 2016-01-08 11:01  小军的代码库  阅读(252)  评论(0编辑  收藏  举报