ホームページ >ウェブフロントエンド >フロントエンドQ&A >jqueryでserializeメソッドを使用する方法

jqueryでserializeメソッドを使用する方法

WBOY
WBOYオリジナル
2022-03-16 14:32:062311ブラウズ

jquery では、serialize() メソッドはフォーム値をシリアル化することで、標準の URL エンコードされたテキスト文字列を作成します。シリアル化された値は、AJAX リクエストを生成するときに URL クエリ文字列で使用できます。構文は " $ (セレクター).serialize()」。

jqueryでserializeメソッドを使用する方法

このチュートリアルの動作環境: Windows10 システム、jquery1.10.2 バージョン、Dell G3 コンピューター。

jquery での Serialize メソッドの使用方法

serialize() 定義と使用法:

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

構文:

$(selector).serialize()

詳細説明

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

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

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

4. フォーム内の名前には、Js または jquery のキーワードを使用できません。

例: length

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

<form id="form1">
   <input name="length" type="text" value="pipi" />
   <input name="blog" type="text" value="blue submarine" />
</form>
//使用:$("#form1").serialize();

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

serialize() の例

1、ajax Serialize()

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

$.ajax({
    type: "POST",
    dataType: "json",
    url:ajaxCallBack,
    data:$(&#39;#myForm&#39;).serialize(),// 要提交表单的ID
    success: function(msg){
        alert(msg);
    }
});

2 、serialize( ) シリアル化された形式の例

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

<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
<script>
$(function(){
   $("#submit").click(function(){
     alert($("#myForm").serialize());
   });
});
</script>
<form id="myForm">
昵称 <input type="text" name="username" value="admin" /><br />
密码 <input type="password" name="password" value="admin123" /><br />
<input type="button" id="submit" value="序列化表单" />
</form>

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

username=admin&password=admin123

関連ビデオ チュートリアルの推奨事項:jQuery ビデオ チュートリアル

以上がjqueryでserializeメソッドを使用する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。