JQuery_jquery での Serialize() の使用法の分析例

この記事の例では、JQuery での Serialize() の使用法について説明します。皆さんの参考に共有してください。具体的な分析は次のとおりです。

1. Serialize() の定義と使用法:

serialize() メソッドは、フォーム値をシリアル化することによって、標準の URL エンコードされたテキスト文字列を作成します。その操作オブジェクトは、フォーム要素のコレクションを表す jQuery オブジェクトです。 1 つ以上のフォーム要素 (入力フィールドやテキスト フィールドなど)、またはフォーム要素自体を選択できます。シリアル化された値は、AJAX リクエストを行うときに URL クエリ文字列で使用できます。

構文:

$(selector).serialize()

詳しい説明

1. .serialize() メソッドは、標準の URL エンコーディングで表されるテキスト文字列を作成します。これは、フォーム要素のコレクションを表す jQuery オブジェクトを操作します。

2. .serialize() メソッドは、、、<select> などの個別のフォーム要素を選択した jQuery オブジェクトを操作できます。ただし、一般的には <form> タグ自体をシリアル化する方が簡単です。 </form></select>

3. 「成功したコントロール」のみが文字列にシリアル化されます。ボタンを使用してフォームを送信しない場合、送信ボタンの値はシリアル化されません。フォーム要素の値をシーケンス文字列に含める場合は、要素で name 属性を使用する必要があります。

4. フォーム内の名前には、Js および jquery のキーワードを使用できません。
例: 長さ

コードをコピー コードは次のとおりです:

//使用:$("#form1").serialize();

上記の値は取得できません。

2. JQuery
のserialize()の例
1. ajax シリアル化()

コードをコピー コードは次のとおりです。

$.ajax({

入力: "POST"、
データ型: "json"、
url:ajaxCallBack、
Data:$('#myForm').serialize(),//送信するフォームのID
成功: function(msg){
アラート(メッセージ);
}
});

2.serialize() フォームインスタンスをシリアル化します

コードをコピーします コードは次のとおりです:

ニックネーム

パスワード

ボタンをクリックすると、次のポップアップが表示されます:

ユーザー名=管理者&パスワード=admin123

3. Serialize は、param メソッド
を使用する、serializeArray の単純なラッパーです。
1. $.param()

$.param() メソッドは、serialize() メソッドの中核であり、キー/値に従って配列またはオブジェクトをシリアル化するために使用されます。

paramメソッドのjsコード

コードをコピー コードは次のとおりです:

パラメータ: function( a ) {
///
/// このメソッドは内部メソッドです。  代わりに、serialize() を使用してください。
/// まとめ>
/// 文字列にシリアル化するキーと値のペアのマップ。'
///
///

var s = [ ];

関数 add( キー, 値 ){
    s[ s.length ] = encodeURIComponent(key) '=' encodeURIComponent(value);
};

// 配列が渡された場合は、それが配列であると仮定します
// フォーム要素
if ( jQuery.isArray(a) || a.jquery )
    // フォーム要素をシリアル化します
    jQuery.each( a, function(){
 add( this.name, this.value );
    });

// それ以外の場合は、キーと値のペアのオブジェクトであると想定します
それ以外
    // キー/値をシリアル化します
    for ( var j in a )
 // 値が配列の場合、キー名を繰り返す必要があります
 if ( jQuery.isArray(a[j]) )
     jQuery.each( a[j], function(){
  add( j, this );
     });
 それ以外
     add( j, jQuery.isFunction(a[j]) ? a[j]() : a[j] );

// 結果のシリアル化を返します
return s.join("&").replace(/ /g, " ");
}

例：

复制代码代码如下:

var obj = {a:1,b:2,c:3};
var k = $.param(obj);
アラート(k);    //输出a=1&b=2&c=3

 
2、配列のシリアル化
 
SerializeArray メソッドは、1 つの表内の各フィールドの順序を 1 つの数組に整列化します
SerializeArray メソッドの jquery 定義

复制代码代码如下:

serializeArray: function() {
///
/// すべてのフォームとフォーム要素をシリアル化しますが、JSON データ構造を返します。
/// まとめ>
/// シリアル化された項目を表す JSON データ構造。

return this.map(function(){
    this.elements を返しますか? jQuery.makeArray(this.elements) : this;
})
.filter(function(){
    this.name を返す && !this.disabled &&
 (this.checked || /select|textarea/i.test(this.nodeName) ||
     /text|hidden|password|search/i.test(this.type));
})
.map(function(i, elem){
    var val = jQuery(this).val();
    戻り値 == null ? null :
 jQuery.isArray(val) ?
     jQuery.map( val, function(val, i){
  return {名前: elem.name、値: val};
     }) :
     {名前: elem.name、値: val};
    }).get();
}

serializeArray データベースの例：

复制代码代码如下:

[ {
 名前: ユーザー名、
 値: 中国
 }、{
 名前: パスワード、
 値: xxx
}]

ここで説明されている大規模な jQuery プログラムの設計が役立つことを望みます。