jquery將表第二列值合併到下一列值

Question

我想合併列2的值與我的表中的列3，我的表具有超過20行。

我正在爲class =「column2」添加第2列的類，爲class =「column3」添加了3。 和我的表類名是genTable。

如何將每個列中的2個值合併到列3..eg中。在第二欄我有'名字'和第三欄我有'姓'作爲測試，然後在這個腳本我想看到'姓氏姓'一起incolumn 3所有的列？

JS：

$(document).ready(function(){ 
    $(".genTable tr").each(function(){ 
      var col2value = $(".column2").text(); 
      var col3value = $(".column3").text(); 
      $(col2value).append(col3value); 
    }) 
}); 

如何給他人所有行每一列的值合併嗎？我們需要使用for循環嗎？

Answer 1

您可以附加column3內容column2，之後從表中刪除column3：

$(".genTable tr .column2").append(function() { 
    return ' ' + $(this).next('.column3').remove().html(); 
}); 

查看下面的演示。

$(".genTable tr .column2").append(function() { 
 
    return ' ' + $(this).next().remove().html(); 
 
});

table {border-collapse: collapse;} 
 
table td, table th {padding: 10px 5px; border: 1px #AAA solid;} 
 
table th {background: #EEE;} 
 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table class="genTable"> 
 
    <tr> 
 
     <th>ID</th> 
 
     <th class="column2">First name</th> 
 
     <th class="column3">Last name</th> 
 
     <th>Occupation</th> 
 
    </tr> 
 
    <tr> 
 
     <td>1</td> 
 
     <td class="column2">Thomas</td> 
 
     <td class="column3">Mann</td> 
 
     <td>Writer</td> 
 
    </tr> 
 
    <tr> 
 
     <td>2</td> 
 
     <td class="column2">Jon</td> 
 
     <td class="column3">Smith</td> 
 
     <td>Artist</td> 
 
    </tr> 
 
</table>

Answer 2

1.方案1：使用jQuery 最接近（）或下（）函數。

$(document).ready(function(){ 
     $(".genTable tr td.column2").each(function(){ 
      var col2value = $(this).text();// replace text() with html() to get/set entire html inside selected html element 
      var col3value = $(this).next("td.column3").text(); 
      $(this).text(col2value + " " + col3value); 
     }); 
}); 

See here ...

2.選項2：多一個屬性添加到您的類（說你的類名是用戶）

public class User 
    { 
     public string FirstName {get; set;} 
     public string LastName {get; set;} 
     public string FullName {get {return FirstName + LastName ;}} 
    }