Jquery隐藏表格单元格内容答案

【问题标题】：Jquery to hide table cell contentsJquery隐藏表格单元格内容
【发布时间】：2010-03-04 22:33:56
【问题描述】：

我有一张这样布置的桌子：

<table>
  <tr>
    <td>checkbox</td>
    <td>text-text-text</td>
    <td>dropdownlist</td>
    <td>textbox</td>
  </tr>
</table>

我正在尝试根据复选框的检查状态切换下拉列表和文本框的可见性。我已经设置了一个单击事件可以正确执行此操作，但是在加载新数据时它不会保留行的可见性。我怎样才能在 Jquery 中做到这一点？

编辑：这是与复选框上的单击事件相关联的函数。它正确切换元素的可见性。我遇到的问题是从数据库中加载新行以开始正确的可见性。（我在 asp.net 中使用中继器控件来构建表，所以我将客户端 ID 传递到函数中）。

简化：我在每行的第一个单元格中有一个带有复选框的表格，我将使用 jquery 中的哪个选择器从复选框中获取该行中其余单元格的内容。

 function ToggleVisibility(position, hometown, state, checkbox, name, license) {
        if ($("#" + checkbox)[0].checked) {
            $("#" + position).css('visibility', 'visible').fadeIn('slow');
            $("#" + hometown).css('visibility', 'visible').fadeIn('slow');
            $("#" + state).css('visibility', 'visible').fadeIn('slow');
            $("#" + name).css('font-weight', 'bold');
            $("#" + license).css('font-weight', 'bold');
        }
        else {
            $("#" + position).css('visibility', 'hidden').fadeOut('slow');
            $("#" + hometown).css('visibility', 'hidden').fadeOut('slow');
            $("#" + state).css('visibility', 'hidden').fadeOut('slow');
            $("#" + name).css('font-weight', 'normal');
            $("#" + license).css('font-weight', 'normal');
        }
}

【问题讨论】：

标签： asp.net javascript jquery

【解决方案1】：

做到这一点的唯一方法是使用 Ajax 将更新的状态持久化到服务器。例如：

<input type="checkbox" id="cb1" class="save">

与：

$(":checkbox.save").click(function() {
  $.post('/save.php', {id: this.id, checked: this.checked});
  $("rowid").toggle(this.checked);
});

然后当服务器渲染页面时，它可以查询持久化的页面状态并正确渲染控件和行。

【讨论】：

我正在使用 asp.net，并且我没有遇到持久化值的问题，这只是在加载它们后让它们具有正确可见性的问题，因为没有“点击" 发生在复选框上。
@Barry：最好的方法是使用由服务器动态生成的内联 CSS（如果必须的话，甚至是内联 JS）来以正确的状态启动事物。或者，您可以添加一个函数，将所有内容置于正确状态并在文档就绪时调用它。
我正在尝试做第二个（从 document.ready 调用的函数），但我很难找到正确的元素。

【解决方案2】：

你可能想看看 livequery，它是一个 jquery 插件： Livequery

【讨论】：

【解决方案3】：

将要隐藏的项目放入 DIV 中并隐藏 DIV，而不是表格单元格。

【讨论】：