Question

我有一个问题，我用一些行编码了表格，之后我需要在点击后交换一些行：

function move_up(x) {

    var cur = x.parentNode.parentNode;
    var cur_upd = cur.previousSibling.previousSibling;

    var temp = cur.innerHTML;
    cur.innerHTML = cur_upd.innerHTML;
    cur_upd.innerHTML = temp;
}               

function move_down(x) {

    var cur = x.parentNode.parentNode;
    var cur_upd = cur.nextSibling.nextSibling;

    var temp = cur.innerHTML;
    cur.innerHTML = cur_upd.innerHTML;
    cur_upd.innerHTML = temp ;

}

我的表格有这样的行：

<tr>
  <TD >
    Typ projektu 1
  </TD>
  <TD  align="center">
     <input type="text" class="order_num" name="x_order_num_PROJECT_TYPE" value="1">
     <input type="checkbox" name="x_PROJECT_TYPE_on" checked>
  </TD>
  <td>
    <a href="#" onclick="move_up(this)">Hore</a>
    <a href="#" onclick="move_down(this)">Dole</a>
  </td>
  <TD align="LEFT">
    <select class="selectbox" name="x_PROJECT_TYPE" style="width: 250px">
      <OPTION VALUE="-1" SELECTED>Všetky</option>
      <OPTION VALUE="1" SELECTED>Fixed price</option>
      <OPTION VALUE="2">Time and materials</option>
    </select>
  </TD>
  <TD>&#x25B2; 
    <INPUT TYPE="radio" NAME="x_sort" VALUE="PROJECT_TYPE;asc">
    &nbsp;&nbsp;&nbsp;
    <INPUT TYPE="radio" NAME="x_sort" VALUE="PROJECT_TYPE;desc">
     &#x25BC;
  </TD>
</TR>

点击href'Hore'或'Dole'之后看起来不错，但问题是，当我调用表单提交后，在交换列之后，它会提交除交换行之外的所有行的所有输入。该行的输入未提交。有什么问题？

Answer 1

不要使用innerHTML移动元素，只需移动DOM元素。

function move_up(x) {
    var cur = x.parentNode.parentNode;
    var cur_upd = cur.previousSibling.previousSibling;
    var parent = cur.parentNode;
    parent.insertBefore(cur, cur_upd);
}               

function move_down(x) {
    var cur = x.parentNode.parentNode;
    var cur_upd = cur.nextSibling.nextSibling;
    var parent = cur.parentNode;
    parent.insertBefore(cur_upd, cur);    
}

如果有任何事件侦听器绑定到元素，或者应用程序具有引用它们的变量，那么将它们来回转换为HTML将失去这一点。

交换行表单后不发送数据，javascript

1 个答案: