jQuery to serialize only elements within a div

I would like to get the same effect as jQuery.serialize() but I would like to return only the child elments of a given div.

Sample result :

single=Single2&multiple=Multiple&radio=radio1
112363 次浏览

没问题。只要使用下面的代码就可以了。它的行为和序列化表单完全一样,只是使用了 div 的内容。

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

检查 https://jsbin.com/xabureladi/1以获得演示(代码为 https://jsbin.com/xabureladi/1/edit)

如果您限制 jQuery 将要查看的条目,就可以提高代码的速度。

使用选择器 : 输入而不是 *来实现它。

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

这将使您的代码更快,因为项目列表更短。

试试这个:

$(’# divId’) . find (‘ input’) . seralize ()

我目前使用的函数:

/**
* 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;
}
$('#divId > input, #divId > select, #divId > textarea').serialize();

那我的解决办法呢:

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>

serialize一个 div中的所有表单元素。

你可以这样做,通过定位你的 form内部的 div #target-div-id,使用:

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

如果这些元素有一个通用的类名,也可以这样使用:

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

通过这种方式,您可以避免选择按钮,这些按钮将使用 jQuery 选择器 :input进行选择。尽管这也可以通过使用 $('#your_div :input:not(:button)').serialize();来避免