Question

我有一张这样的桌子。

<table>
    <tr>
        <td>A</td>
        <td><select id="B" name="B">
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
        </select>
        </td>
        <td>C</td>
        <td>D</td>
    </tr>
    <tr>
        <td>E</td>
        <td class="sample">F: will hide/show</td>
        <td class="sample">G: will hide/show</td>
        <td>H</td>
    </tr>
    <tr>
        <td>I</td>
        <td class="id1">J</td>
        <td class="id1">K</td>
        <td>L</td>
    </tr>
    <tr>
        <td>M</td>
        <td class="id2">N</td>
        <td class="id2">O</td>
        <td>P</td>
    </tr>
</table>

然后，每当我更改<td>B选择选项中的值时，<td>F和<td>G都会隐藏.. 它会向上移动<td> ...以下 <td>J＆amp; <td>K至<td>F＆amp; <td>G，
<td>N＆amp; <td>O至<td>J＆amp; <td>K，

如果显示<td>F和<td>G，则会发生相反的情况..其他<td>会向下移动

这是我开始的jquery。

$('select#B').change(function(event) {

          if (this.value == '2') {
                $(".sample").show();
          } else {
                $(".sample").hide();
          }
        });

http://jsfiddle.net/rucsh/40/

Answer 1

高级指示，

克隆要移动的目标元素
保存变量
删除原始元素
将克隆元素（在步骤2中）插入所需位置。

以上所有步骤都可以使用jQuery轻松竞争。

jquery - 如何将td移动到另一个td

1 个答案: