如何在 xhtml 中使用 jQuery？答案

【问题标题】：How to use jQuery with in xhtml?如何在 xhtml 中使用 jQuery？
【发布时间】：2010-10-08 08:30:30
【问题描述】：

我在 XHTML 中使用 facelets、richfaces 和 ajax
我在创建日期选择器时遇到错误！我的问题的解决方案是什么？
代码是：

    <?xml version="1.0" encoding="ISO-8859-1" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html   xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:a4j="https://ajax4jsf.dev.java.net/ajax"
      xmlns:rich="http://richfaces.ajax4jsf.org/rich">

    <head>

<a4j:loadScript src="jquery/jquery-1.4.2.min.js" />
<a4j:loadScript src="jquery/jquery-ui-1.8.5.custom.min.js" />
  </head>
  <body>
  <h:form>
  <rich:panel>
  <h:inputText id="mydate" value="" label="test" size="20"/>
  <rich:jQuery selector="#mydate" name="mydate" query="datepicker({changeMonth:true,changeYear:true})" timing="onload"/>


  </rich:panel>
  </h:form>



 </body>

</html>

我得到的错误是：

 INFO: Added Library from: jar:file:/D:/WS/.metadata/.plugins/org.eclipse.wst.server.core/tmp0/wtpwebapps/RichTest/WEB-INF/lib/richfaces-ui-3.3.3.Final.jar!/META-INF/ajax4jsf.taglib.xml
Oct 8, 2010 1:51:30 PM com.sun.facelets.FaceletViewHandler handleRenderException
SEVERE: Error Rendering View[/jquery/jquery-1.4.2.min.js]
com.sun.facelets.FaceletException: Error Parsing /jquery/jquery-1.4.2.min.js: Error Traced[line: 1] Content is not allowed in prolog.
    at com.sun.facelets.compiler.SAXCompiler.doCompile(SAXCompiler.java:234)
    at com.sun.facelets.compiler.Compiler.compile(Compiler.java:105)
    at com.sun.facelets.impl.DefaultFaceletFactory.createFacelet(DefaultFaceletFactory.java:197)
    at com.sun.facelets.impl.DefaultFaceletFactory.getFacelet(DefaultFaceletFactory.java:144)
    at com.sun.facelets.impl.DefaultFaceletFactory.getFacelet(DefaultFaceletFactory.java:95)
    at com.sun.facelets.FaceletViewHandler.buildView(FaceletViewHandler.java:517)
    at com.sun.facelets.FaceletViewHandler.renderView(FaceletViewHandler.java:567)
    at org.ajax4jsf.application.ViewHandlerWrapper.renderView(ViewHandlerWrapper.java:100)
    at org.ajax4jsf.application.AjaxViewHandler.renderView(AjaxViewHandler.java:176)
    at com.sun.faces.lifecycle.RenderResponsePhase.execute(RenderResponsePhase.java:106)
    at com.sun.faces.lifecycle.LifecycleImpl.phase(LifecycleImpl.java:251)
    at com.sun.faces.lifecycle.LifecycleImpl.render(LifecycleImpl.java:144)
    at javax.faces.webapp.FacesServlet.service(FacesServlet.java:245)
    at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:290)
    at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:206)
    at org.ajax4jsf.webapp.BaseXMLFilter.doXmlFilter(BaseXMLFilter.java:206)
    at org.ajax4jsf.webapp.BaseFilter.handleRequest(BaseFilter.java:290)
    at org.ajax4jsf.webapp.BaseFilter.processUploadsAndHandleRequest(BaseFilter.java:388)
    at org.ajax4jsf.webapp.BaseFilter.doFilter(BaseFilter.java:515)
    at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:235)
    at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:206)
    at org.apache.catalina.core.StandardWrapperValve.invoke(StandardWrapperValve.java:233)
    at org.apache.catalina.core.StandardContextValve.invoke(StandardContextValve.java:175)
    at org.apache.catalina.core.StandardHostValve.invoke(StandardHostValve.java:128)
    at org.apache.catalina.valves.ErrorReportValve.invoke(ErrorReportValve.java:102)
    at org.apache.catalina.core.StandardEngineValve.invoke(StandardEngineValve.java:109)
    at org.apache.catalina.connector.CoyoteAdapter.service(CoyoteAdapter.java:263)
    at org.apache.coyote.http11.Http11Processor.process(Http11Processor.java:844)
    at org.apache.coyote.http11.Http11Protocol$Http11ConnectionHandler.process(Http11Protocol.java:584)
    at org.apache.tomcat.util.net.JIoEndpoint$Worker.run(JIoEndpoint.java:447)
    at java.lang.Thread.run(Thread.java:619)
Oct 8, 2010 1:51:30 PM com.sun.faces.lifecycle.LifecycleImpl phase
WARNING: executePhase(RENDER_RESPONSE 6,com.sun.faces.context.FacesContextImpl@19e733e) threw exception
com.sun.facelets.FaceletException: Error Parsing /jquery/jquery-1.4.2.min.js: Error Traced[line: 1] Content is not allowed in prolog.
    at com.sun.facelets.compiler.SAXCompiler.doCompile(SAXCompiler.java:234)
    at com.sun.facelets.compiler.Compiler.compile(Compiler.java:105)
    at com.sun.facelets.impl.DefaultFaceletFactory.createFacelet(DefaultFaceletFactory.java:197)
    at com.sun.facelets.impl.DefaultFaceletFactory.getFacelet(DefaultFaceletFactory.java:144)
    at com.sun.facelets.impl.DefaultFaceletFactory.getFacelet(DefaultFaceletFactory.java:95)
    at com.sun.facelets.FaceletViewHandler.buildView(FaceletViewHandler.java:517)
    at com.sun.facelets.FaceletViewHandler.renderView(FaceletViewHandler.java:567)
    at org.ajax4jsf.application.ViewHandlerWrapper.renderView(ViewHandlerWrapper.java:100)
    at org.ajax4jsf.application.AjaxViewHandler.renderView(AjaxViewHandler.java:176)
    at com.sun.faces.lifecycle.RenderResponsePhase.execute(RenderResponsePhase.java:106)
    at com.sun.faces.lifecycle.LifecycleImpl.phase(LifecycleImpl.java:251)
    at com.sun.faces.lifecycle.LifecycleImpl.render(LifecycleImpl.java:144)
    at javax.faces.webapp.FacesServlet.service(FacesServlet.java:245)
    at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:290)
    at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:206)
    at org.ajax4jsf.webapp.BaseXMLFilter.doXmlFilter(BaseXMLFilter.java:206)
    at org.ajax4jsf.webapp.BaseFilter.handleRequest(BaseFilter.java:290)
    at org.ajax4jsf.webapp.BaseFilter.processUploadsAndHandleRequest(BaseFilter.java:388)
    at org.ajax4jsf.webapp.BaseFilter.doFilter(BaseFilter.java:515)
    at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:235)
    at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:206)
    at org.apache.catalina.core.StandardWrapperValve.invoke(StandardWrapperValve.java:233)
    at org.apache.catalina.core.StandardContextValve.invoke(StandardContextValve.java:175)
    at org.apache.catalina.core.StandardHostValve.invoke(StandardHostValve.java:128)
    at org.apache.catalina.valves.ErrorReportValve.invoke(ErrorReportValve.java:102)
    at org.apache.catalina.core.StandardEngineValve.invoke(StandardEngineValve.java:109)
    at org.apache.catalina.connector.CoyoteAdapter.service(CoyoteAdapter.java:263)
    at org.apache.coyote.http11.Http11Processor.process(Http11Processor.java:844)
    at org.apache.coyote.http11.Http11Protocol$Http11ConnectionHandler.process(Http11Protocol.java:584)
    at org.apache.tomcat.util.net.JIoEndpoint$Worker.run(JIoEndpoint.java:447)
    at java.lang.Thread.run(Thread.java:619)
Oct 8, 2010 1:51:30 PM org.ajax4jsf.webapp.BaseXMLFilter doXmlFilter
SEVERE: Exception in the filter chain
javax.servlet.ServletException: Error Parsing /jquery/jquery-1.4.2.min.js: Error Traced[line: 1] Content is not allowed in prolog.
    at javax.faces.webapp.FacesServlet.service(FacesServlet.java:249)
    at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:290)
    at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:206)
    at org.ajax4jsf.webapp.BaseXMLFilter.doXmlFilter(BaseXMLFilter.java:206)
    at org.ajax4jsf.webapp.BaseFilter.handleRequest(BaseFilter.java:290)
    at org.ajax4jsf.webapp.BaseFilter.processUploadsAndHandleRequest(BaseFilter.java:388)
    at org.ajax4jsf.webapp.BaseFilter.doFilter(BaseFilter.java:515)
    at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:235)
    at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:206)
    at org.apache.catalina.core.StandardWrapperValve.invoke(StandardWrapperValve.java:233)
    at org.apache.catalina.core.StandardContextValve.invoke(StandardContextValve.java:175)
    at org.apache.catalina.core.StandardHostValve.invoke(StandardHostValve.java:128)
    at org.apache.catalina.valves.ErrorReportValve.invoke(ErrorReportValve.java:102)
    at org.apache.catalina.core.StandardEngineValve.invoke(StandardEngineValve.java:109)
    at org.apache.catalina.connector.CoyoteAdapter.service(CoyoteAdapter.java:263)
    at org.apache.coyote.http11.Http11Processor.process(Http11Processor.java:844)
    at org.apache.coyote.http11.Http11Protocol$Http11ConnectionHandler.process(Http11Protocol.java:584)
    at org.apache.tomcat.util.net.JIoEndpoint$Worker.run(JIoEndpoint.java:447)

请告诉我原因。

【问题讨论】：

标签： jquery ajax jsf xhtml facelets

【解决方案1】：

根据http://seamframework.org/Community/HowToWriteJavaScriptInXHTML，您只需：

<a4j:loadScript src="resource://jquery.js"/>

【讨论】：

您好 Blair McMillan，感谢您提供的信息。您的回答确实帮助我找出了问题所在。我工作了两个多小时才得到准确的结果，最后我找到了程序。这是下面给出的......！
优秀。很高兴它能让你走上正轨。

【解决方案2】：

我的问题是： 如何在 xhtml 中使用 jQuery？

我的答案是： 1.使用下面给出的代码创建一个xhtml页面。

<?xml version="1.0" encoding="ISO-8859-1" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html   xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:a4j="https://ajax4jsf.dev.java.net/ajax"
      xmlns:rich="http://richfaces.ajax4jsf.org/rich">

    <head>
    <link type="text/css" href="css/flick/jquery-ui-1.8.5.custom.css" rel="stylesheet" />
<a4j:loadScript src="resource:///jquery/jquery-1.4.2.min.js" />
<a4j:loadStyle src="/jquery/jquery-ui-1.8.5.custom.css" />
<a4j:loadScript src="resource:///jquery/jquery-ui-1.8.5.custom.min.js" />     
  </head>
  <body >      
  <h:form>
  <rich:panel>
  <h:inputText id="dp1" value="" label="test"  />
  <rich:jQuery  selector="#dp1" name="dp1" rendered="true" timing="onload" query="datepicker({chosendate:'01/05/2005',minYear:'-20Y',maxDate: '+1Y +1M',appendText: '(dd-mm-yyyy)',changeMonth:true,changeYear:true})" ></rich:jQuery>        
  </rich:panel>
  </h:form>    
 </body>    
</html>

2.然后尝试将 JQuery.xx.js & css 文件放在下面的顺序！

---网页内容
+主题
+....
...jquery-1.4.2.min.js
...jquery-ui-1.8.5.custom.css
...jquery-ui-1.8.5.custom.min.js

所有这些都在上面的 .xhtml 文件中配置。

3.我们需要在web.xml 中为facelets、richfaces 和ajax 配置的一般东西是常见的，一路走来。
4.最后它完美地工作了。 ..
谢谢你的家伙..

【讨论】：