2010-03-04 63 views
0

我有一个布局像这样的表:jQuery来隐藏表格单元格内容

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

我试图切换基于复选框的检查状态的下拉列表,文本框的可见性。我已经设置了一个能够正确执行此操作的单击事件,但是它不会在加载新数据时保留行的可见性。我如何在JQuery中做到这一点?

编辑:这是连接到复选框上的单击事件的功能。它正确切换elemtns的可见性。我遇到的问题是从数据库中加载新行,从正确的可见性开始。 (我在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'); 
     } 
} 
+0

我们能否看到JS请 – 2010-03-04 14:20:03

回答

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

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

+0

不,这不是唯一的方法... – Guffa 2010-03-04 14:29:39

+0

我使用的是asp.net,并且我没有让值持续存在问题,这只是让他们在加载它们之后具有正确的可见性,因为复选框上没有发生“点击”。 – Barry 2010-03-04 14:35:29

+0

@Barry:最好的方法是使用由服务器动态生成的内联CSS(或者甚至是内联JS),以正确的状态启动事物。或者,您可以添加一个函数,将所有内容都置于正确的状态,并在准备好的文档中调用它。 – cletus 2010-03-04 14:53:18

0

你可能想看看的liveQuery,这是jQuery的一个插件: Livequery

0

把你想在一个DIV隐藏的项目和隐藏DIV,而不是表格单元格。

相关问题