jquery如何在子表单div中选择表单元素

Question

假设我有以下表格：

​

​<form id="f">
    <input name="a"/>
    <input name="b"/>
    <div id="sub_part">
        <input name="c"/>
        <input name="d"/>
    </div>
</form>
<form id="e">
    <input name="a"/>
    <input name="b"/>
    <div id="sub_part2">
        <input name="c"/>
        <input name="d"/>
    </div>
</form>

我通常可以使用.serialize() 获取所有名称-> 值对。例如。我知道我可以通过以下方式从f 表格中获取信息：

$('form#f').serialize();

如果只想要sub_part div 中f 形式的名称-> 值对怎么办？在这种情况下，jquery 选择器会是什么？对于本练习，我不想更改 html 的结构。

请查看我列出问题的这个小提琴：http://jsfiddle.net/gu9XB/4/

注意我尝试选择子表单的方式不起作用。

Answer 1

只需序列化 div 内的输入。您还使用了 .sub_part 所以它没有选择 div。如果已经有 ID，您可以通过 id 选择以使其更快

('#sub_part input').serialize();

这是一个有效的小提琴http://jsfiddle.net/gu9XB/21/

Answer 2

使用这个：

$('#but1').click(function() {
    var data = $('form#f').serialize();
    alert(data);
});

$('#but2').click(function() {
    var data = $('#f #sub_part *').serialize();
    alert(data);
});​

这里是DEMO

Answer 3

使用以下代码 它会在你的情况下工作

 $('#f #sub_part input').serialize();

Answer 4

如其他答案所述，serialize() 方法不适用于 div。解决这个问题的一种方法是创建一个 jQuery 对象，它将处理并将您选择的元素附加到此：

var data = $('<form>').append($('form#f .sub_part')).serialize();

Answer 5

使用这个 CSS 选择器

$('#e > div')

这将选择sub_part div。匹配发生是因为它是表单元素的直接子元素。如果sub_part中有嵌套的div，则不会受到影响。

您还有一个带有 sub_part 的重复 ID。您应该将 id 更改为一个类或更改其中一个 id 的名称。

http://jsfiddle.net/dceast/gu9XB/15/