Question

我有这个javascript函数可以隐藏表中的列：

function hideColumn (name) {
    column = $("#taula-thead td:contains("+name+")")[0].cellIndex;
    $("#taula-thead td:contains("+name+")").hide();
    $("#taula-tbody td:nth-child("+(column+1)+")").hide();
}

因此，当页面加载时，另一个函数会读取一些cookie以查看哪些列应该隐藏，并为每个列调用此函数。但该功能只隐藏了thead部分。

我调试它并且...代码在我调试时工作。所以我可能问题是它执行得太快或者什么东西并且把函数放在setTimeout中。但它也失败了。最后我尝试用这种方式写作：$("#taula-thead td:contains("+name+")").hide() && $("#taula-tbody td:nth-child("+(column+1)+")").hide();但是......它也失败了。

所以......我无法调试代码，因为它适用于调试，我甚至不确定问题是什么。

更新

我发现问题但不是一个好的解决方案。我在另一个插入很多行的函数之后执行此函数。看起来当javascript执行此操作时，尚未检测到行，因此它只隐藏了thead部分。

如果我将函数放在setTimeout中50ms的延迟，它就可以了。如果它有30毫秒，它有时会工作。如果它有10毫秒，它永远不会工作。我正在寻找一种方法来找出正确设置新行的时间，然后执行此功能。

Answer 1

您应该添加引号。所以这个：

column = $("#taula-thead td:contains(" + name + ")")[0].cellIndex;

实际上您的代码正在运行，请参阅下面的代码段。如果出现问题，则表示您未发布的其他代码。

工作代码段

function hideColumn(name) {
  column = $("#taula-thead td:contains(" + name + ")")[0].cellIndex;
  $("#taula-thead td:contains(" + name + ")").hide();
  $("#taula-tbody td:nth-child(" + (column + 1) + ")").hide();
}

table {
  border-collapse: collapse;
}
td {
  border: 1px solid black;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Click on a column to hide it</p>
<table>
  <thead id="taula-thead">
    <tr>
      <td onclick='hideColumn("ID")'>ID</td>
      <td onclick='hideColumn("name")'>name</td>
      <td onclick='hideColumn("some other column")'>some other column</td>
    </tr>
  </thead>
  <tbody id='taula-tbody'>
    <tr>
      <td>1</td>
      <td>2</td>
      <td>3</td>
    </tr>
    <tr>
      <td>1</td>
      <td>2</td>
      <td>3</td>
    </tr>
    <tr>
      <td>1</td>
      <td>2</td>
      <td>3</td>
    </tr>
  </tbody>
</table>

javascript函数只能调试

1 个答案: