jQuery .each 用于子元素

Question

我正在尝试使用 jquery，它是在这种类型的结构中获取值的每个函数：

     <div id="test">
       <p><input name="name1" value="Z1"></p>
       <p><input name="name2" value="Z2"></p>
       <p><input name="name3" value="Z3"></p>
       <p><input name="name4" value="Z4"></p>
      </div>

我试过使用

        $('#test').find('input').each(function () { }
        $('#test > p').children('input').each(function () { }

但我使用的值警报（$（这个）。值）；总是 'undefined'。有什么想法吗？

Answer 1

您应该遍历每个 <p> 标签，因为它们还有其他兄弟姐妹，然后在每个函数中找到输入并获取值。

这会起作用：

$('#test > p').each(function(){
    var value = $(this).find('input').val();
});

Answer 2

       $('#test input').each(function(i,v){
            console.log($(this).val());
       });

说明：我们有一个'#test input'的选择器，这意味着我们正在直接或间接地在#test中搜索所有input。到目前为止，一切都很好。但是，我们需要它们的 values，因此，在函数内部我们记录 $(this).val() 的结果，它将值输出到控制台。

Answer 3

您的两种检索元素的方法都可以正常工作。您看到 undefined 是因为您访问输入值的方式：.val() 而不是 .value.

所以：

$('#test').find('input').each(function() {
  $(document.body).append($(this).val());
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="test">
  <p><input name="name1" value="Z1"></p>
  <p><input name="name2" value="Z2"></p>
  <p><input name="name3" value="Z3"></p>
  <p><input name="name4" value="Z4"></p>
</div>

Answer 4

第一个是工作伙伴。我不确定你的问题是什么。

https://jsfiddle.net/tsj0w29x/ $('#test').find('input').each(function () { alert($(this).value); }

Answer 5

或者，您可以使用选择器 #test input 来检索 div 上的所有输入，您可以通过 .each() 方法快速访问这些输入，就像这样:

var values = [];
$('#test input').each(function (){
    values.push($(this).val());
});
console.log(values);

查看此 jsFiddle 了解更多信息。

希望对您有所帮助。干杯。

jQuery .each 用于子元素

jQuery .each for Sub-elements

each

jquery