循环遍历jQuery中的元素

时间:2008-10-04 11:39:25

标签: javascript jquery

我想循环遍历HTML表单的元素,并存储< input>的值。对象中的字段。但是,以下代码不起作用:

function config() {
    $("#frmMain").children().map(function() {
        var child = $("this");
        if (child.is(":checkbox"))
            this[child.attr("name")] = child.attr("checked");
        if (child.is(":radio, checked"))
            this[child.attr("name")] = child.val();
        if (child.is(":text"))
            this[child.attr("name")] = child.val();
        return null;
    });

以下内容(受jobscry的回答启发):

function config() {
    $("#frmMain").children().each(function() {
        var child = $("this");
        alert(child.length);
        if (child.is(":checkbox")) {
            this[child.attr("name")] = child.attr("checked");
        }
        if (child.is(":radio, checked"))
            this[child.attr("name")] = child.val();
        if (child.is(":text"))
            this[child.attr("name")] = child.val();
    });
}

警报始终显示child.length == 0。手动选择元素有效:

    
>>> $("#frmMain").children()
Object length=42
>>> $("#frmMain").children().filter(":checkbox")
Object length=3

有关如何正确执行循环的任何提示?

7 个答案:

答案 0 :(得分:40)

不认为你需要引用:

var child = $("this");

尝试:

var child = $(this);

答案 1 :(得分:28)

jQuery具有很好的循环一组元素的功能:.each()

$('#formId').children().each(
    function(){
        //access to form element via $(this)
    }
);

答案 2 :(得分:13)

根据您对每个孩子的需求(如果您希望通过AJAX在某处发布),您可以做...

$("#formID").serialize()

它会自动为您创建一个包含所有值的字符串。

至于循环对象,你也可以这样做。

$.each($("input, select, textarea"), function(i,v) {
    var theTag = v.tagName;
    var theElement = $(v);
    var theValue = theElement.val();
});

答案 3 :(得分:3)

之前我使用过以下内容:

var my_form = $('#form-id');
var data = {};

$('input:not([type=checkbox]), input[type=checkbox]:selected, select, textarea', my_form).each(
    function() {
        var name = $(this).attr('name');
        var val = $(this).val();

        if (!data.hasOwnProperty(name)) {
            data[name] = new Array;
        }

        data[name].push(val);
    }
);

这只是从内存中写的,因此可能包含错误,但这应该会生成一个名为data的对象,其中包含所有输入的值。

请注意,您必须以特殊方式处理复选框,以避免获取未选中复选框的值。无线电输入可能也是如此。

另请注意,使用数组存储值,对于一个输入名称,您可能具有来自多个输入的值(特别是复选框)。

答案 4 :(得分:0)

如果你想使用每个函数,它应该是这样的:

$('#formId').children().each( 
  function(){
    //access to form element via $(this)
  }
);

只需将关闭的花括号切换为关闭花边。谢谢你指出来,求职,你节省了一些时间。

答案 5 :(得分:0)

对我来说,所有这些都没有用。对我有用的东西非常简单:

$("#formID input[type=text]").each(function() {
alert($(this).val());
});

答案 6 :(得分:-1)

这是循环访问表单元素的表单的最简单方法。在每个功能中,您可以检查并构建您想要的任何内容。构建对象时请注意,您需要在每个函数之外声明它。

EDIT JSFIDDLE

以下内容可行

$('form[name=formName]').find('input, textarea, select').each(function() {
    alert($(this).attr('name'));
});