关于表行删除的滚动问题

时间:2016-01-28 09:13:09

标签: javascript html

我有以下HTML代码:

<tr id="cv643" ondblclick="onCVE(643)">
  <td colspan="2">
    <a onclick="btnCVA(41,643)" href="#">
      Actions  
      <span class="badge badgew">2</span>
    </a>
  </td>
  <td>Confirm Appointment</td>
  <td>29-12-2015</td>
  <td style="color: red">12-01-2016</td>
  <td style="color: red">Pending</td>
  <td colspan="2"></td>
</tr>

客户端代码是:

function btnCVA(cpkey, cvkey) {  
  var sel, tbl;
  if (onHideCVA()) {   // test if Action list already there
    $.ajax call to create table row with id 'recCVA'
  }
}

function onHideCVA() { 
  var sel, rc=1;
  if ((sel = document.getElementById('recCVA')) !== null) {
    sel.parentNode.removeChild(sel);
    rc=0;
  }
  return rc;
}   

单击“操作”按钮时,btnCVA在下面使用recCVA结构创建一行,该行包含一个子表,[thead]上有一个按钮,用于调用onHideCVA,这样就删除了recCVA tr结构:

<tr id="recCVA">
  <td></td>
  <td colspan="7">
    <table id="tblCVA" class="table table-condensed">
      <thead id="Q643">
        <tr class="lpinfo">
          <th></th>
          <th>Action</th>
          <th>Date</th>
          <th>User</th>
          <th>Recipient</th>
          <th>Due Date</th>
          <th>Status</th>
          <th>Note</th>
          <th style="text-align:right">
            <button id="addCVA" class="btn btn-info btn-xs" onclick="btnCVAA(643)">Add Action</button>
            <button class="btn btn-info btn-xs" onclick="onHideCVA()">- </button>
          </th>
        </tr>
      </thead>
      <tbody>
        (Lots of trs)
    </table>

因此,从btnCVA调用onHideCVA,并在内部按钮上直接调用onHideCVA。 在页面大于屏幕的情况下,如果我单击直接调用onHideCVA的按钮,则会删除recCVA行,并且页面不会滚动。正是我想要的。如果我点击btnCVA a-link,间接调用onHideCVA,则会删除该行,但页面会滚动到顶部。不是我想要的。 我无法解决这个问题。调用onHideCVA会直接删除该行而不会删除任何内容。通过btnCVA间接调用onHideCVA会删除该行,但会滚动到页面顶部。非常混乱。

Firefox 40.0.3。

有任何帮助吗?谢谢。埃里克。

0 个答案:

没有答案