jQuery एक div के भीतर केवल तत्वों को क्रमबद्ध करने के लिए

Question

मैं उसी तरह का प्रभाव प्राप्त करना चाहूंगा, jQuery.serialize()लेकिन मैं किसी दिए गए बच्चे के पात्र को लौटाना चाहूंगा div।

नमूना परिणाम:

single=Single2&multiple=Multiple&radio=radio1

Answer 1

कोई दिक्कत नहीं है। बस निम्नलिखित का उपयोग करें। यह ठीक वैसा ही व्यवहार करेगा जैसे किसी रूप को क्रमबद्ध करना लेकिन उसके बजाय एक div सामग्री का उपयोग करना।

$('#divId :input').serialize();

चेक https://jsbin.com/xabureladi/1 एक प्रदर्शन (के लिए https://jsbin.com/xabureladi/1/edit कोड के लिए)

Comments

$("#divId").find("select, textarea, input").serialize();बेहतर प्रदर्शन नहीं करेंगे ? मुझे लगता है कि उपरोक्त धीमा हो सकता है अगर div में बहुत सारे तत्व थे, जैसे कि कई पंक्तियों / स्तंभों वाली तालिका।

— डेविड मर्डोक

जैसा कि अन्य उत्तरों में सूचीबद्ध है, $ ('# divId: input')। serialize () अधिक कुशल होगा।

— jfountain

@EaterOfCorpses यह परीक्षण करने का बहुत सटीक तरीका नहीं है। यदि आप कथनों के क्रम को बदलते हैं, तो आप देखेंगे कि वास्तव में कोई अंतर नहीं है: jsfiddle.net/QAKjN/10 । चयनकर्ताओं की तुलना में खेलने में अधिक है

— रॉन्डेल

स्पष्ट रूप से यह केवल इनपुट्स को अनुक्रमित करता है, इसलिए डेविड मर्डोक की टिप्पणी इसे करने का सही तरीका होगा।

— सुपरफॉनिक

jQuery: "क्योंकि: इनपुट एक jQuery एक्सटेंशन है और CSS विनिर्देशन का हिस्सा नहीं है, प्रश्नों का उपयोग करते हुए: इनपुट देशी DOM querySelectorAll () विधि द्वारा प्रदान किए गए प्रदर्शन को बढ़ावा देने का लाभ नहीं उठा सकता है।" $ ('[नाम]') का उपयोग करना बेहतर होगा: document.querySelectorAll ('[नाम]');

— अब्दुल्ला आयदीन

Answer 2

आप अपने कोड की गति में सुधार कर सकते हैं यदि आप आइटम को प्रतिबंधित करते हैं तो jQuery दिखेगा।

चयनकर्ता का उपयोग करें : इसे प्राप्त करने के लिए * के बजाय इनपुट ।

$('#divId :input').serialize()

यह आपके कोड को तेज़ कर देगा क्योंकि मदों की सूची छोटी है।

Answer 3

serializeसभी फार्म-तत्वों के भीतर एक div।

आप #target-div-idअपने formउपयोग के अंदर div को लक्षित करके ऐसा कर सकते हैं :

$('#target-div-id').find('select, textarea, input').serialize();

Answer 4

वर्तमान में मैं जिस फ़ंक्शन का उपयोग करता हूं:

/**
 * Serializes form or any other element with jQuery.serialize
 * @param el
 */
serialize: function(el) {
    var serialized = $(el).serialize();
    if (!serialized) // not a form
        serialized = $(el).
          find('input[name],select[name],textarea[name]').serialize();
    return serialized;
}

Comments

इसके अलावा .find ('[नाम]'); serialize (); 'धारावाहिक' तत्वों को फ़िल्टर करने के लिए इस्तेमाल किया जा सकता है।

— अब्दुल्ला एदीन

Answer 5

इसे भी आज़माएँ:

$ ( '# Divid')। लगता है ( 'इनपुट')। Serialize ()

Comments

इस serialize div में तत्वों और textareas का चयन नहीं होगा

— जेफ वाकर कोड रेंजर

यह चयन और textarea समस्या को ठीक करता है: <code> $ ("# divId")। खोजें ("चुनें, textarea, इनपुट")। serialize (); <// कोड>

— ट्रॉयसेवेन

Answer 6

मेरे समाधान के बारे में क्या:

function serializeDiv( $div, serialize_method )
{
    // Accepts 'serialize', 'serializeArray'; Implicit 'serialize'
    serialize_method = serialize_method || 'serialize';

    // Unique selector for wrapper forms
    var inner_wrapper_class = 'any_unique_class_for_wrapped_content';

    // Wrap content with a form
    $div.wrapInner( "<form class='"+inner_wrapper_class+"'></form>" );

    // Serialize inputs
    var result = $('.'+inner_wrapper_class, $div)[serialize_method]();

    // Eliminate newly created form
    $('.script_wrap_inner_div_form', $div).contents().unwrap();

    // Return result
    return result;
}

/* USE: */

// For: $('#div').serialize()
serializeDiv($('#div')); /* or */ serializeDiv($('#div'), 'serialize');

// For: $('#div').serializeArray()
serializeDiv($('#div'), 'serializeArray');

function serializeDiv( $div, serialize_method )
{
	// Accepts 'serialize', 'serializeArray'; Implicit 'serialize'
	serialize_method = serialize_method || 'serialize';

	// Unique selector for wrapper forms
	var inner_wrapper_class = 'any_unique_class_for_wrapped_content';

	// Wrap content with a form
	$div.wrapInner( "<form class='"+inner_wrapper_class+"'></form>" );

	// Serialize inputs
	var result = $('.'+inner_wrapper_class, $div)[serialize_method]();

	// Eliminate newly created form
	$('.script_wrap_inner_div_form', $div).contents().unwrap();

	// Return result
	return result;
}

/* USE: */

var r = serializeDiv($('#div')); /* or serializeDiv($('#div'), 'serialize'); */
console.log("For: $('#div').serialize()");
console.log(r);

var r = serializeDiv($('#div'), 'serializeArray');
console.log("For: $('#div').serializeArray()");
console.log(r);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="div">
  <input name="input1" value="input1_value">
  <textarea name="textarea1">textarea_value</textarea>
</div>

Answer 7

यदि उन तत्वों का एक सामान्य वर्ग नाम है, तो कोई भी इसका उपयोग कर सकता है:

$('#your_div .your_classname').serialize()

इस तरह आप बटनों के चयन से बच सकते हैं, जिसे jQuery चयनकर्ता का उपयोग करके चुना जाएगा :input। हालांकि इसके इस्तेमाल से भी बचा जा सकता है$('#your_div :input:not(:button)').serialize();

Answer 8

$('#divId > input, #divId > select, #divId > textarea').serialize();

Comments

यदि अल्पविराम का उपयोग किया जाता है, तो आपको IDप्रत्येक चयनकर्ता को निर्दिष्ट करने की आवश्यकता है , जैसे $('#divId > input, #divId > select, #divId > textarea'):; इसके अलावा, यह >प्रतीक प्रत्यक्ष बच्चों के तत्वों को संदर्भित करता है ... इस परिदृश्य में बहुत असामान्य या कम से कम, बहुत प्रतिबंधक।

— gmo