Question

我想将第2列值与表格中的第3列合并，并将我的表格合并为超过20行。

我为第2列添加了class =＆＃34; column2＆＃34;和3 = class =＆＃34; column3＆＃34;。我的表类名是genTable。

如何将每个列2的值合并到列3..eg中。在第2列我有＆＃39; firstname＆＃39;和第3列我有＆＃39;姓氏＆＃39;作为测试然后在这个脚本后我想看到＆＃39; firstname lastname＆＃39;所有列中的第3列一起？

JS：

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

如何将所有行的每个列值合并到另一个列中？我们需要使用for循环吗？

Answer 1

<强> 1。选项1：使用jquery nearest（）或 next（）函数。

$(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 ;}}
   }

Answer 2

您可以将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>

jquery将表第二列值合并到下一列值

2 个答案: