Question

我有一张如下所示的表：

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

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

编辑：这是与复选框上的click事件相关联的功能。它正确地切换了元素的可见性。我遇到的问题是从数据库中加载新行，以正确的可见性开始。（我在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');
        }
}

Answer 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);
});

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

Answer 2

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

Answer 3

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

Jquery隐藏表格单元格内容

3 个答案: