Question

'.edit'中有三个输入字段。如何使用jQuery获取每个值的值？

$submit.click(value);      

function value () {
    for (var i = 0; i < 3; i++) {
        var $input = $('.edit').children('input').eq(i).val();
        console.log($input);
    }
}

<div class="edit">
    <h3>Headline</h3>
    <span>Text</span>
    <input type="text" id="one">
    <span>Text</span>
    <input type="text" id="two">
    <span>Text</span>
    <input type="text" id="three">
    <button class="submit">Submit</button>
</div>

不起作用。为什么？还可以设置默认值：.val() || 'unknown'？

Answer 1

您需要在提交点击时循环浏览.edit下的输入，并使用$(this)获取每个输入值

＆＃13;

$('.submit').click(function(){

  $('.edit').find('input[type=text]').each(function(){

  console.log($(this).val());

});
    
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="edit">
    <h3>Headline</h3>
    <span>Text</span>
    <input type="text" id="one" value="default">
    <span>Text</span>
    <input type="text" id="two">
    <span>Text</span>
    <input type="text" id="three">
    <button class="submit">Submit</button>
</div>

＆＃13;

Answer 2

$('.submit').click(function() {
  $('.edit').find('input').each(function(index, value) {

    console.log("index is " + index + " " + "value is " + $(this).val())


  })

})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="edit">
  <h3>Headline</h3>
  <span>Text</span>
  <input type="text" id="one" value='1'>
  <span>Text</span>
  <input type="text" id="two" value='2'>
  <span>Text</span>
  <input type="text" id="three" value='3'>
  <button class="submit">Submit</button>
</div>

您可以使用.each()

描述：迭代jQuery对象，为每个匹配的元素执行一个函数。

jQuery：如何获得孩子的val（）（'input'）。eq？

2 个答案: