如何通过jQuery隐藏控件组？

在我的Sharepoint项目/ Web部件/网页中，我使用* .ascx.cs文件中的C＃动态创建页面元素/控件。

在* .ascx文件中，我使用jQuery来响应页面上发生的事件（选择，复选框状态的更改等）。

我需要有条件地隐藏页面上的控件/元素组。 具体来说，如果用户选中某个复选框，我可以“删除”页面的整个区域，在该场景中，不适用于她。

我怎样才能做到这一点？ 我有这个起点：

/* If the select "Yes" (they are seeking payment for themselves, as opposed to someone else), omit (invisibilize) sections 2 and 3 on the form */ $(document).on("change", '[id$=ckbxPaymentForSelf]', function () { var ckd = this.checked; if (ckd) { // what now? } }); 

我可以做头发拉出的方式（这对我来说非常痛苦，因为我的头发几乎和押沙龙一样多），并设置每个单独的元素，如下：

 if (ckd) { var $this = $('[id$=txtbxthis]'); var $that = $('[id$=txtbxthat]'); var $theother = $('[id$=txtbxtheother]'); . . . // store a reference to all the other to-be-affected elements in vars $this.visible = false; // <= this is pseudoscript; I don't know what the jQuery to invisiblize an element is $that.visible = false; // " " $theother.visible = false; // " " . . . // invisiblize all the other to-be-affected elements } 

当然有更优雅/更好的方式！

是将所有条件不可见的元素分配给特定的类，然后调用分配给该类的每个元素，或者是什么？

此外，我希望这个现在看不见的地带以前使用过的区域“走开”或“卷起来”不会坐在那里，只有一个空白的凝视，打哈欠的峡谷，或戈壁沙漠般的无特征的广阔空间。

Answer 1

有很多方法可以做到这一点。 但是在你的jquery实现中，我会用数据标签来装饰元素，这些数据标签将告诉代码隐藏和显示哪些元素。

   var $group1 = $('*[data-group="1"]'); var $group2 = $('*[data-group="2"]'); if (ckd) { $group1.hide(); $group2.show(); } else{ $group2.hide(); $group1.show(); } 

你也可以用css类做同样的事情，但我更喜欢使用data属性

Answer 2

如果可以使用类对控件进行分组，则可以选择需要在该特定方案中隐藏的类，并使用hide()函数：

 if (ckd) { var cls = getClassForCurrentScenario(); $("." + cls).hide(); //slideUp() would be an animated alternative } 

例如，如果控件可以在div分组，那么您只需要隐藏该元素：

 if (ckd) { var id = getElementIdForCurrentScenario(); $("#" + id).hide(); //slideUp() would be an animated alternative } 

这实际上取决于您如何将控件分组到“目标组”中，以便以后可以有效地访问它们。

Answer 3

你可以像这样隐藏一个元素：

 $('...').hide(); 

或者你可以用以下方式向上滑动：

 $('...').slideUp(); 

得到一个很好的滑动动画。

另外，在您的情况下，您可以同时对多个元素执行此操作：

 $('[id$=txtbxthis], [id$=txtbxthat], [id$=txtbxtheother]').slideUp();