JSF更改css样式属性onclick

为了清楚起见，我有一个具有特定样式的div，当我单击该div内的commandButton时，我想将display属性设置为“none”

我希望通过单击commandButton更改css样式

下面是我的xhtml：

<div class="details" id="detailsPopUp" style="#{detailsPopUpManager.style}">
                <h:commandButton image="resources/images/close Icon.png" 
                                 action="#{detailsPopUpManager.closePopUp()}" 
                                 class="closeIcon"/>
</div>

---

感谢您的进一步帮助。

您需要使用ajax来实现这一结果

<h:form id="myForm">
   <div class="details" id="detailsPopUp" style="#{detailsPopUpManager.style}">
                <h:commandButton image="resources/images/close Icon.png" 
                                 action="#{detailsPopUpManager.closePopUp()}" 
                                 class="closeIcon">
                   <f:ajax render="myForm"/>
                </h:commandButton>

   </div>
</h:form>

谢谢您的帮助。在我的帖子中有“-1”，我想我问了一些非常简单的问题，但我对jsf是新手，不习惯ajax。我已经阅读、理解并将自己作为示例展示在这里：。但是我不能用css复制同样的东西。很抱歉耽误您的时间，但您能告诉我您将如何做吗？无论我尝试做什么（基于您的代码），我总是得到一个“空PK”。您一定是从其他地方得到了该异常。因为我的代码不能导致null PK异常。它与某个数据库操作相关。这段代码在我的电脑上运行良好。哦，是的，你是对的。我认为这是链接，因为只有当我点击commandButton时才会抛出null PK异常。谢谢你的帮助，我会检查我的代码！

<h:form id="myForm">
   <div class="details" id="detailsPopUp" style="#{detailsPopUpManager.style}">
                <h:commandButton image="resources/images/close Icon.png" 
                                 action="#{detailsPopUpManager.closePopUp()}" 
                                 class="closeIcon">
                   <f:ajax render="myForm"/>
                </h:commandButton>

   </div>
</h:form>