A Brief Introduction to serialize () serialization of jQuery, jqueryserialize

A Brief Introduction to serialize () serialization of jQuery, jqueryserialize

A Brief Introduction to serialize () serialization of jQuery:

In jQuery, when ajax is used, the input data is often assembled and sent to the server in the form of Key-Value pairs.

The serialize method can easily complete this task. You can use this method to serialize the form into a key-Value Pair (key1 = value1 & key2 = value2) and then submit it.

The following describes how to use serialize () in JQuery:

I. serialize () Definition and usage:

The serialize () method creates a standard URL-encoded text string by serializing the form value. Its operation object is a jQuery object representing the form Element Set.

You can select one or more form elements (such as input or text box) or form elements.

Serialized values can be used in URL query strings when an AJAX request is generated. Syntax structure:

$(selector).serialize()

Detailed description:

(1). the serialize () method creates a text string encoded with a standard URL. Its operation object is a jQuery object that represents the form Element Set.

(2) The serialize () method can be used to operate jQuery objects that have selected individual form elements, such as <input>, <textarea>, and <select>. However, it is easier to select the <form> label itself for serialization.

(3). Only the "successful control" is serialized as a string. If the button is not used to submit a form, the value of the submit button is not serialized. To include the value of a form element in a sequence string, the element must use the name attribute.

(4) The name in. form cannot use the keyword in Js or jquery.

For example, length:

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

The value cannot be obtained.

Ii. serialize () instance in jQuery:

(1). ajax serialize ():

$. Ajax ({type: "POST", dataType: "json", url: ajaxCallBack, data: $ ('# myForm '). serialize (), // The ID success: function (msg) {alert (msg) ;}} of the form to be submitted );}});

(2). serialize () serialized form instance:

<Script src = "jquery-1.7.min. Js "> </script> <script >$ (function () {$ (" # submit "). click (function () {alert ($ ("# myForm "). serialize ());});}); </script> <form id = "myForm"> nickname <input type = "text" name = "username" value = "admin"/> <br/> password <input type = "password" name = "password" value = "admin123"/> <br/> <input type = "button" id = "submit" value = "serialized form"/> </form>

Click the button to bring up:

username=admin&password=admin123

3. serialize is a simple package for serializeArray using param:

1. $. param (): $. param () is the core of the serialize () method. It is used to serialize an array or object according to keyalue.

Js Code of the param method:

param: function( a ) {        ///    <summary>        ///        This method is internal.  Use serialize() instead.        ///    </summary>        ///    <param name="a" type="Map">A map of key/value pairs to serialize into a string.</param>'        ///    <returns type="String" />        ///    <private />        var s = [ ];        function add( key, value ){            s[ s.length ] = encodeURIComponent(key) + '=' + encodeURIComponent(value);        };        // If an array was passed in, assume that it is an array        // of form elements        if ( jQuery.isArray(a) || a.jquery )            // Serialize the form elements            jQuery.each( a, function(){                add( this.name, this.value );            });        // Otherwise, assume that it's an object of key/value pairs        else            // Serialize the key/values            for ( var j in a )                // If the value is an array then the key names need to be repeated                if ( jQuery.isArray(a[j]) )                    jQuery.each( a[j], function(){                        add( j, this );                    });                else                    add( j, jQuery.isFunction(a[j]) ? a[j]() : a[j] );        // Return the resulting serialization        return s.join("&").replace(/%20/g, "+");    }

For example:

Var obj = {a: 1, B: 2, c: 3}; var k = $. param (obj); alert (k); // output a = 1 & B = 2 & c = 3

(2). serializeArray:

The serializeArray method serializes fields in a form into an array.

Jquery definition of the serializeArray method:

serializeArray: function() {        ///    <summary>        ///        Serializes all forms and form elements but returns a JSON data structure.        ///    </summary>        ///    <returns type="String">A JSON data structure representing the serialized items.</returns>        return this.map(function(){            return this.elements ? jQuery.makeArray(this.elements) : this;        })        .filter(function(){            return 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();            return val == null ? null :                jQuery.isArray(val) ?                    jQuery.map( val, function(val, i){                        return {name: elem.name, value: val};                    }) :                    {name: elem.name, value: val};        }).get();    }

SerializeArray data example:

[{Name: username, value: China}, {name: password, value: xxx}]

Original address: http://www.51texiao.cn/jqueryjiaocheng/2015/0525/2461.html

The original address is: http://www.softwhy.com/forum.php? Mod = viewthread & tid = 17200.