ホームページ > ウェブフロントエンド > jsチュートリアル > JQuery の Serialize()、serializeArray()、および param() メソッドの例の紹介

JQuery の Serialize()、serializeArray()、および param() メソッドの例の紹介

巴扎黑
リリース: 2017-07-03 13:50:50
オリジナル
976 人が閲覧しました

serialize() メソッドは、JQuery オブジェクト にも作用し、DOM 要素の内容を strings にシリアル化できます。serializeArray() メソッドは文字列を返しませんが、DOM 要素をシリアル化し、JSON を返します。フォーマットされたデータ

以下はサーバー側 JSP コードです:


<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> 
<% 
request.setCharacterEncoding("UTF-8"); 
String username = request.getParameter("username"); 
String content = request.getParameter("content"); 
out.println("<p class=&#39;comment&#39;><h6> "+username+" :</h6><p class=&#39;para&#39;> "+content+" 
</p></p>"); 
%>
ログイン後にコピー

JQuery の他のメソッドと同様に、serialize() メソッドも JQuery オブジェクトに対して動作し、DOM 要素のコンテンツを ajax 用の文字列にシリアル化できます。リクエスト。 Serialize() メソッドを使用すると、このページのすべてのフィールドを送信できます。コードは次のとおりです。


$("#send").click(function(){ 
$.get("get1.jsp", $("#form1").serialize(), function(data, textStatus) 
$("#resText").html(data); 
});
});
ログイン後にコピー

「送信」ボタンをクリックすると、form1 に属するすべてのフォーム要素をバックグラウンドに送信できます。フォームの「フィールドの追加」で再度使用されない場合でも、スクリプトは引き続き使用でき、追加の作業は必要ありません。

文字列モードを使用する場合は、文字エンコーディングに注意する必要があります (中国語の問題)。エンコーディングによって問題が発生したくない場合は、自動的にエンコードする Serialize() メソッドを使用できます。

serialize() メソッドは JQuery オブジェクトに作用するため、フォームだけでなく、次の JQuery コードのように、他のセレクターによって選択された要素もそれを使用できます。 checkbox

とラジオボタンボックスの値は文字列形式にシリアル化され、選択された値のみがシリアル化されます。


JQuery の Serialize() に似たメソッド、serializeArray() もあります。このメソッドは文字列を返しませんが、DOM 要素をシリアル化し、JSON 形式でデータを返します。 JQuery コードは次のとおりです。

$(":checkbox,:radio").serialize();
ログイン後にコピー

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

たとえば、通常の

オブジェクト
をシリアル化します:

var fields = $(":checkbox,:radio").serializeArray();
console.log(fields); //用FireBug输出
ログイン後にコピー

以上がJQuery の Serialize()、serializeArray()、および param() メソッドの例の紹介の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート