如何仅在发生onclick / oncomplete / on…事件且不在页面加载时调用JSF支持

Question

我有两个图像按钮：

<div class="sidebarOptions">

    <input type="image" src="images/homeButton.jpg" onclick="#{home.setRendered(1)}"/>

</div>

<div class="sidebarOptions">

    <input type="image" src="images/memberButton.jpg" onclick="#{home.setRendered(2)}"/>

</div>

但是，当页面加载值1和2时，这两种方法都会立即被调用。同样，当我单击它时，这两种方法也会被调用。

当实际单击图像按钮时，如何才能实现仅调用bean方法的所需功能？

Answer 1

这种方法行不通。您似乎在混淆/混淆“服务器端”和“客户端”的基本Web开发概念，并且误解了JSF和EL的角色。JSF是一种服务器端语言，它根据HTTP请求在Web服务器上运行，并生成HTML / CSS / JS代码，该代码随HTTP响应返回。格式为${}和的所有EL表达式#{}将在生成HTML输出期间在服务器端执行。JavaScript是一种客户端语言，可在网络浏览器上运行并在HTML DOM树上运行。HTML onclick属性应指定一个JavaScript函数，该函数将在特定HTML DOM事件上在客户端执行。为了调用JSF托管bean方法，您需要actionor *listener属性。JSF提供了一些组件来生成所需的HTML并指定所需的ajax操作，这些操作将更改服务器端状态。一个<input type="image">可利用来产生<h:commandButton image>。可以通过该action组件的属性调用Bean方法。可以通过嵌入<f:ajax>标签来使该组件无效。因此，以下应为您做到这一点：<h:form>&nbsp; <div class="sidebarOptions">&nbsp; &nbsp; <h:commandButton image="images/homeButton.jpg" action="#{home.setRendered(1)}">&nbsp; &nbsp; &nbsp; <f:ajax execute="@this" render=":sidebar" />&nbsp; &nbsp; </h:commandButton>&nbsp; </div>&nbsp; <div class="sidebarOptions">&nbsp; &nbsp; <h:commandButton image="images/memberButton.jpg" action="#{home.setRendered(2)}">&nbsp; &nbsp; &nbsp; <f:ajax execute="@this" render=":sidebar" />&nbsp; &nbsp; </h:commandButton>&nbsp; </div></h:form><!-- The below is just a guess of what you're really trying to achieve. --><h:panelGroup id="sidebar" layout="block">&nbsp; <h:panelGroup rendered="#{home.rendered eq 1}">&nbsp; &nbsp; Home&nbsp; </h:panelGroup>&nbsp; <h:panelGroup rendered="#{home.rendered eq 2}">&nbsp; &nbsp; Member&nbsp; </h:panelGroup></h:panelGroup>