我正在研究 JSF 1.x 在 JavaServer Faces in Action 中所述的一个示例。
命令按钮上调用的 javascript 不起作用。两个 onmouseover/out 事件都没有执行这些方法。
我的项目结构如下：
在这个例子中我没有使用任何 Java 代码，它只包含一个登录页面。
login.jsp 如下：
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>
<f:view>
<html>
<head>
<link rel="stylesheet" type="text/css" href="stylesheet.css" />
<script type="text/javascript">
function set_image(button, image){
button.src = img;
}
</script>
<title><h:outputText value="ProjectTrack" /></title>
</head>
<body>
<h:form>
<h:panelGrid columns="2" border="0" cellpadding="3" cellspacing="3">
<h:graphicImage url="/images/logo.png"
alt="Welcome to ProjectTrack" title="Welcome to ProjectTrack"
width="149" height="160" />
<h:panelGrid columns="3" border="0" cellpadding="5" cellspacing="3" headerClass="login-heading">
<f:facet name="header">
<h:outputText value="ProjectTrack" />
</f:facet>
<h:outputLabel for="userNameInput" >
<h:outputText value="Enter your user name: " />
</h:outputLabel>
<h:inputText id="userNameInput" size="20" maxlength="30" required="true">
<f:validateLength minimum="5" maximum="30"/>
</h:inputText>
<h:message for="userNameInput" />
<h:outputLabel for="passwordInput">
<h:outputText value="Password"/>
</h:outputLabel>
<h:inputSecret id="passwordInput" size="20" maxlength="20" required="true">
<f:validateLength minimum="5" maximum="15" />
</h:inputSecret>
<h:message for="passwordInput" />
<h:panelGroup>
<h:commandButton action="success"
image="/images/submit.gif"
onmouseover="set_image(this, '/images/submit_over.gif'); alert('button: ' + this );"
onmouseout="set_image(this, '/images/submit.gif'); alert('button: ' + this ); "
/>
</h:panelGroup>
</h:panelGrid>
</h:panelGrid>
<h:outputText value=" Debug test for EL exp : #{facesContext.externalContext.requestContextPath}/images/submit.gif" />
</h:form>
</body>
</f:view>
</html>
我的部署描述符 web.xml 如下：
<web-app version="2.5"
xmlns="http://java.sun.com/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">
<display-name>Project Track</display-name>
<description>Sample Project</description>
<servlet>
<servlet-name>Faces Servlet</servlet-name>
<servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
<load-on-startup>1</load-on-startup>
</servlet>
<servlet-mapping>
<servlet-name>Faces Servlet</servlet-name>
<url-pattern>/faces/*</url-pattern>
</servlet-mapping>
<welcome-file-list>
<welcome-file>faces/login.jsp</welcome-file>
</welcome-file-list>
</web-app>
Faces-config.xml 如下：
<?xml version="1.0"?>
<!DOCTYPE faces-config PUBLIC
"-//Sun Microsystems, Inc.//DTD JavaServer Faces Config 1.0//EN"
"http://java.sun.com/dtd/web-facesconfig_1_0.dtd">
<faces-config>
<application>
<message-bundle>ptrackResources</message-bundle>
</application>
<navigation-rule>
<from-view-id>/login.jsp</from-view-id>
<navigation-case>
<from-outcome>success</from-outcome>
<to-view-id>/inbox.jsp</to-view-id>
</navigation-case>
<navigation-case>
<from-outcome>failure</from-outcome>
<to-view-id>/login.jsp</to-view-id>
</navigation-case>
</navigation-rule>
</faces-config>
我的 Maven 依赖项如下：
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
<modelVersion>4.0.0</modelVersion>
<groupId>com.achutha.labs</groupId>
<artifactId>03JsfExample</artifactId>
<version>0.0.1-SNAPSHOT</version>
<packaging>war</packaging>
<name>03JsfExample</name>
<description>Project Track</description>
<dependencies>
<dependency>
<groupId>javax.faces</groupId>
<artifactId>jsf-api</artifactId>
<version>1.2_14</version>
</dependency>
<dependency>
<groupId>javax.faces</groupId>
<artifactId>jsf-impl</artifactId>
<version>1.2_14</version>
</dependency>
<dependency>
<groupId>javax.servlet</groupId>
<artifactId>jstl</artifactId>
<version>1.2</version>
</dependency>
<dependency>
<groupId>javax.servlet</groupId>
<artifactId>servlet-api</artifactId>
<version>2.5</version>
</dependency>
<dependency>
<groupId>javax.servlet.jsp</groupId>
<artifactId>jsp-api</artifactId>
<version>2.1</version>
</dependency>
<!-- EL -->
<dependency>
<groupId>org.glassfish.web</groupId>
<artifactId>el-impl</artifactId>
<version>2.2</version>
</dependency>
</dependencies>
<build>
<finalName>JavaServerFaces</finalName>
<plugins>
<plugin>
<groupId>org.codehaus.mojo</groupId>
<artifactId>tomcat-maven-plugin</artifactId>
<configuration>
<url>http://localhost:8090/manager/text</url>
<server>TomcatServer</server>
<path>/balaji</path>
</configuration>
</plugin>
<plugin>
<groupId>org.apache.maven.plugins</groupId>
<artifactId>maven-compiler-plugin</artifactId>
<version>2.3.1</version>
<configuration>
<source>1.6</source>
<target>1.6</target>
</configuration>
</plugin>
</plugins>
</build>
</project>
应用程序运行成功。但是“提交的图像”按钮未显示，该按钮是通过运行时表达式检索的。
浏览器显示：
JavaScript 没有调用声明的事件。
<h:commandButton action="success"
image="/images/submit.gif"
onmouseover="set_image(this, '/images/submit_over.gif'); alert('button: ' + this );"
onmouseout="set_image(this, '/images/submit.gif'); alert('button: ' + this ); "
/>
我必须使用 JSF 1.x 并且无法将其升级到 JSF 2。请向我建议解决方案，并帮助我知道出了什么问题。
之前：
如问题#{facesContext} EL 表达式在运行时未解析中所述， 我将以下语句用于命令按钮。
<h:commandButton action="success"
image="#{facesContext.externalContext.requestContextPath}/images/submit.gif"
onmouseover="set_image(this, '#{facesContext.externalContext.requestContextPath}/images/submit_over.gif');"
onmouseout="set_image(this, '#{facesContext.externalContext.requestContextPath}/images/submit.gif');"
/>
我刚刚添加了一个 Debug 语句，login.jsp如下所示：
<h:outputText value=" Debug test for EL exp : #{facesContext.externalContext.requestContextPath}/images/submit.gif" />
调试结果：
表达式在运行时被评估，（但未看到提交图像）消除了之前的问题。因此，我删除了 EL 语句，并将它们替换为没有附加项目名称的相对路径。