jQueryでのAjax------04

1981 ワード

一、serialize()方法
プロジェクトを行う過程で、フォームは少なくなくてはいけません.登録、ログインなどのデータを提供するためによく使われています.一般的な方法は、ブラウザ全体がリフレッシュされ、ajaxテクノロジーを使用すると、フォームを非同期でコミットし、サーバから返されたデータを現在のページに表示することです.
フォームのHTMLコードは次のとおりです.
<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>

名前と内容を取得するには、フィールドの値をdataパラメータに1つずつ追加する必要があります.
$("#send").click(function(){
  $.get("get.php",{
  username:$("#username").val(),
  content:$("#content").val()
  }),function(data,textStatus){
  $("#id").thml(data);      //            
  });
})

この方法は、わずかなフィールドしかないフォームでは無理に使用できますが、フォーム要素がますます複雑になると、ワークロードを増大させながらページを使用すると、フォームに弾力性が欠けます.jqueryは、この一般的な操作を簡略化する方法であるserialize()を提供します.jqueryの他のメソッドと同様に、serialize()メソッドも役割ドメインのjqueryオブジェクトであり、ajaxリクエストのためにDON要素のコンテンツを文字列にシーケンス化することができます.serialize()メソッドを使用することで、さっきのjqueryコードを次のように変更できます.
$("#send").click(function(){
  $.get("get.php",$("#form1").serialize(),function(data,textStatus){
    $("#id").html(data);
  })
})

フォームにフィールドを追加しても、スクリプトは使用でき、他の余分な作業は必要ありません.serialize()メソッドはjqueryオブジェクトに作用するため、フォームだけでなく、他のセレクタで選択した要素も使用できます.
$(":checkbox,:radio").serialize();
チェックボックスとラジオボックスの値を文字列形式にシーケンス化し、選択した値のみをシーケンス化します.
二、serializeArray()方法
この方法は文字列を返すのではなく,DOMをシーケンス化してJSON形式のデータを返す.オブジェクトである以上、$を使用できます.each()関数はデータを反復出力する.
三、$.param()メソッド
これはserialize()メソッドの核心であり、1つのデータまたはオブジェクトをkey/valueに従ってシーケンス化するために使用されます.次のようになります.
var obj={a:1,b:2,c:3}
var k=$.param(obj);
alert(k);//  a=1&b=2&c=3