检索一个表内行所有输入字段的值

Question

我有一个表，其中td是输入字段，我需要检索一个tr（表示一个导入用户）内的所有插入值。所以HTML：

<table class="table table-bordered table-hover "> 
    <tbody> 
    <tr> 
     <td>Facebook ID</td> 
     <?php foreach($newArray as $column){?> 
     <?php echo '<td>'.$column.'</td>';}?> 
    </tr> 
    <tr id="firstUser"> 
     <td><input type="text" name="facebook-id1" class="form-control klasa" placeholder=""></td> 
     <?php foreach($newArray as $column){?> 
     <?php echo '<td><input type="text" id="'.$column.'1" onfocus="findName(this)" name="'.$column.'1" class="form-control klasa"></td>';}?> 
    </tr> 

    <tr id="secondUser"> 
     <td><input type="text" name="facebook-id2" class="form-control klasa" placeholder=""></td> 
     <?php foreach($newArray as $column){?> 
     <?php echo '<td><input type="text" id="'.$column.'2" onfocus="findName(this)" name="'.$column.'2" class="form-control klasa"></td>';}?> 
    </tr> 
    <tr id="thirdUser"> 
     <td><input type="text" name="facebook-id3" class="form-control klasa" placeholder=""></td> 
     <?php foreach($newArray as $column){?> 
     <?php echo '<td><input type="text" id="'.$column.'3" onfocus="findName(this)" name="'.$column.'3" class="form-control klasa"></td>';}?> 

    </tr> 
    <tr id="fourthUser"> 
     <td><input type="text" name="facebook-id3" class="form-control klasa" placeholder=""></td> 
     <?php foreach($newArray as $column){?> 
     <?php echo '<td><input type="text" id="'.$column.'4" onfocus="findName(this)" name="'.$column.'4" class="form-control klasa"></td>';}?> 
    </tr> 

    </tbody> 
    </table> 

我想是这样的：

$(document).ready(function(){ 
    $('#plavoDugme').click(function() { 
     var oneUser = {}; 
     $("#firstUser input").each(function() { 
      var $this = $(this); 
      oneUser.first = $this.val(); 
     }) 

     $("#secondUser input").each(function() { 
      var $this = $(this); 
      oneUser.second = $this.val(); 
     }) 

     $("#thirdUser input").each(function() { 
      var $this = $(this); 
      oneUser.third = $this.val(); 
     }) 

     $("#fourthUser input").each(function() { 
      var $this = $(this); 
      oneUser.fourth = $this.val(); 
     }) 
     console.log(oneUser); 
    }); 
}); 

正如你可以看到我试着一个tr像这样中选择所有输入字段：$("#firstUser input")，但是当我console.log(oneUser)只显示的值每个表格行中的最后一个输入字段。请帮助这是简单的任务，但我卡住了。

Answer 1

检查下面的解决方案。

var userList = {}; 
$('#plavoDugme').click(function(){ 
    $('.dynamicList').find('tr').not(':first').each(function(){//loop all rows 
     var $this = $(this); 
     var userType = $this[0].id.replace('User', '');//get id without User text 
     userList[userType] = [];//assign array to it 
     $this.find('input').each(function(){//loop all input in single row 
      userList[userType].push(this.value);//push input value in it 
     }); 
    }); 
    console.log(userList); 
}); 

演示链接：JSFIDDLE

对象的输出：

Answer 2

您可以使用map()函数如下。

$('#plavoDugme').click(function() { 
    var oneUser = {}; 
    oneUser.first = $("#firstUser input").map(function() { 
     return this.value; 
    }); 

    oneUser.second = $("#secondUser input").map(function() { 
     return this.value; 
    }); 
    oneUser.third = $("#thirdUser input").map(function() { 
     return this.value; 
    }); 
    oneUser.third = $("#fourthUser input").each(function() { 
     return this.value; 
    }); 

    console.log(oneUser); 
});