jQUery - Table manipulation



如何使用jQuery将行值中的表更改为多列?如果不同的行是结束的 td 标签,则应在末端添加 tr 标签。总而言之,一列中有多行,但我每列需要一行......我不知道从哪里开始使用 jQUery 来解决这个问题:/

提前非常感谢:)

<table class="search">
   <tbody>
      <tr>
         <td class="field"><div title="Special">Special</div</td>
         <td class="value">
            <input name="f[sp_se_s][0]" value="0" type="hidden">
            <table>
               <tbody>
                 <tr>
                    <td valign="top">
                       <input id="sp_se_s_sp_se_1" value="sp_se_1" name="f[sp_se_s][sp_se_1]" type="checkbox">
                       <label for="sp_se_s_sp_se_1">Option 1</label>
                    </td> 
                    **//HERE I need a </tr><tr>**
                    <td valign="top">
                       <input id="sp_se_s_sp_se_2" value="sp_se_2" name="f[sp_se_s][sp_se_2]" type="checkbox">
                       <label for="sp_se_s_sp_se_2">Option 2</label>
                    </td>
                    **//HERE I need a </tr><tr>**
                    <td valign="top">
                       <input id="sp_se_s_sp_se_3" value="sp_se_3" name="f[sp_se_s][sp_se_3]" type="checkbox">
                       <label for="sp_se_s_sp_se_3">Option 3</label>
                    </td>
                 </tr>
                 <tr>
                    <td valign="top">
                       <input id="sp_se_s_sp_se_4" value="sp_se_4" name="f[sp_se_s][sp_se_4]" type="checkbox">
                       <label for="sp_se_s_sp_se_4">Option 4</label>
                    </td>
                    **//HERE I need a </tr><tr>**
                    <td valign="top">
                       <input id="sp_se_s_sp_se_16" value="sp_se_16" name="f[sp_se_s][sp_se_16]" type="checkbox">
                       <label for="sp_se_s_sp_se_16">Option 5</label>
                    </td>
                    **//HERE I need a </tr><tr>**
                    <td valign="top">
                       <input id="sp_se_s_sp_se_5" value="sp_se_5" name="f[sp_se_s][sp_se_5]" type="checkbox">
                       <label for="sp_se_s_sp_se_5">Option 6</label>
                    </td>
                 </tr>
              </tbody>
           </table>
        </td>
     </tr>  
  </tbody>

在我看来

,一个简单的解决方案是获取<tr>元素中的内容,将它们存储在变量中,从表中删除<tr>元素并恢复<td>元素。

此时,您将留下一个包含大量<td>元素的<tbody>元素。从那时起,就是将所有<td>元素包装在一个<tr>元素中。

在我的头顶上,jQuery语法可能看起来像这样:

var contents = $("table").find("tr").contents().detach();
$("table").find("tr").remove();
$("table tbody").html(contents);
$("table tbody").find("td").wrap("<tr></tr>");

这是演示上述操作的小提琴:

http://jsfiddle.net/Ydsg9/46/

包装方法似乎对您有用

例如,您可以获取所有<td>元素,.wrap <tr>并在新表中或当前表的末尾.append()

最新更新