如何在Oracle Apex中使用javascript隐藏区域

Question

我有一个广播组，根据所选的值，我希望显示一个特定的区域，并使其他两个区域消失。

然而，当我隐藏区域时，可见的区域不占用所有可用空间，留下空白区域。

喜欢这个

我正在使用$x_Hide('ItemID')方法，就像建议的网站一样，但它并没有像宣称的页面那样折叠空间。

我注意到x_Hide实际上没有删除该地区所在的div。

div仍然存在，其内容也是如此。

然后我尝试了$x("ItemID").remove()功能，但这一次 div仍在那里，但其内容不见了。

有没有办法让剩下的区域占用所有可用空间？

Answer 1

APEX的UI设计开箱即用。您需要的只是获得正确区域的句柄并隐藏它。如果做得好，您正在寻找的效果将被应用。如果您在使用javascript查找适当的区域时遇到困难，那么其他更简单的解决方案是使用动态操作功能，如果您刚开始使用APEX，则可以选择。动态操作提供了一种在不需要JavaScript的情况下以声明方式定义复杂客户端行为的方法。

有关动态操作的更多信息，请参阅Oracle文档 - ＆gt; link

Answer 2

我总是尽可能使用内置的Apex功能。但是，如果我遇到古怪的行为，我的最后一招将是一个自定义的JS / JQuery解决方案。所以下面是另一种选择。

通过使用Apex附带的JQuery库，您可以执行以下操作：

1）向目标区域添加静态ID;

2）然后只需创建一个隐藏此区域的JQuery函数：

function hideRegion(ID) {
    $(ID).hide();
}

将此代码放在外部JS文件或页面级（或内联）JS（＆＃34;全局变量声明......＆＃34;部分）中。

3）然后你可以像这样调用（或执行）这个函数：

hideRegion('#the-static-id');

注意：将其置于您触发隐藏该区域的任何动态操作中。

4）然后再次显示它，创建JQuery函数：

function showRegion(ID) {
    $(ID).show();
}

将此代码放在外部JS文件或页面级（或内联）JS（＆＃34;全局变量声明......＆＃34;部分）中。

3）然后你可以像这样调用这个函数：

showRegion('#the-static-id');

现在将其置于您要触发的任何动态动作中以再次显示该区域。

为什么这应该有用

.hide()操作非常类似于使目标div在CSS中具有display:none属性。因此，其他区域应该占用您通过上述功能隐藏的区域留下的空间。同时，.show()会将其恢复为原始显示样式。

希望这有帮助！