jQuery只序列化div中的元素

时间:2009-12-01 22:53:59

标签: jquery serialization

我希望获得与jQuery.serialize()相同的效果,但我想仅返回给定div的子元素。

示例结果:

single=Single2&multiple=Multiple&radio=radio1

8 个答案:

答案 0 :(得分:265)

没问题。只需使用以下内容。这将与序列化表单完全相同,但使用div的内容。

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

点击http://jsbin.com/azodo进行演示(代码为http://jsbin.com/azodo/edit

答案 1 :(得分:21)

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

使用选择器:输入代替 * 来实现它。

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

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

答案 2 :(得分:12)

serialize div

中的所有表单元素

您可以使用以下内容定位#target-div-id内的div form

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

答案 3 :(得分: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;
}

答案 4 :(得分:3)

试试这个:

  

$( '#DIVID')。发现( '输入')。序列()

答案 5 :(得分:2)

我的解决方案如何:

NameError: undefined local variable or method `x' for main:Object

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);

答案 6 :(得分:0)

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

答案 7 :(得分:-1)

如果这些元素有一个共同的类名,也可以使用它:

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

这样您可以避免选择按钮,这些按钮将使用jQuery选择器:input进行选择。虽然使用$('#your_div :input:not(:button)').serialize();

也可以避免这种情况