JSFとJQueryが動作しない

Question

JQueryをJSFで動作させようとしていますが、成功しませんでした。スクリプトはresourcesというフォルダにあります。私はNetBeansを使用しています。

これは私のJSPコードです：

<?xml version="1.0" encoding="UTF-8"?> 
<!-- 
Document : testpage 
Created on : 08.07.2009, 01:16:01 
Author  : reBourne 
--> 
<jsp:root version="2.1" xmlns:f="http://java.sun.com/jsf/core"  xmlns:h="http://java.sun.com/jsf/html" xmlns:jsp="http://java.sun.com/JSP/Page" xmlns:webuijsf="http://www.sun.com/webui/webuijsf"> 
<jsp:directive.page contentType="text/html;charset=UTF-8" pageEncoding="UTF-8"/> 
<f:view> 
    <webuijsf:page id="page1"> 
     <webuijsf:html id="html1"> 
      <webuijsf:head id="head1"> 
       <webuijsf:link id="link1" url="/resources/css/stylesheet.css"/> 
       <webuijsf:script id="script1" url="resources/jquery.js"/> 
       <webuijsf:script id="script2" url="recources/main.js" /> 

<style> 
body { 
margin:0; 
padding:40px; 
background:#fff; 
font:80% Arial, Helvetica, sans-serif; 
color:#555; 
line-height:180%; 
} 

h1{ 
font-size:180%; 
font-weight:normal; 
color:#555; 
} 
h2{ 
clear:both; 
font-size:160%; 
font-weight:normal; 
color:#555; 
margin:0; 
padding:.5em 0; 
} 
a{ 
text-decoration:none; 
color:#f30; 
} 
p{ 
clear:both; 
margin:0; 
padding:.5em 0; 
} 
pre{ 
display:block; 
font:100% "Courier New", Courier, monospace; 
padding:10px; 
border:1px solid #bae2f0; 
background:#e3f4f9; 
margin:.5em 0; 
overflow:auto; 
width:800px; 
} 

img{border:none;} 
ul,li{ 
margin:0; 
padding:0; 
} 
li{ 
list-style:none; 
float:left; 
display:inline; 
margin-right:10px; 
} 



/* */ 

#preview{ 
position:absolute; 
border:1px solid #ccc; 
background:#333; 
padding:5px; 
display:none; 
color:#fff; 
} 

/* */ 
</style> 
      </webuijsf:head> 
      <webuijsf:body id="body1" style="-rave-layout: grid"> 
       <webuijsf:form id="form1"> 
        <ul> 
         <li> 
          <a class="preview" href="resources/images/1.jpg"> 
           <img alt="gallery thumbnail" src="resources/images/1s.jpg"/> 
          </a> 
         </li> 
         <li> 
          <a class="preview" href="resources/images/2.jpg"> 
           <img alt="gallery thumbnail" src="resources/images/2s.jpg"/> 
          </a> 
         </li> 
         <li> 
          <a class="preview" href="resources/images/3.jpg"> 
           <img alt="gallery thumbnail" src="resources/images/3s.jpg"/> 
          </a> 
         </li> 
         <li> 
          <a class="preview" href="resources/images/4.jpg"> 
           <img alt="gallery thumbnail" src="resources/images/4s.jpg"/> 
          </a> 
         </li> 
        </ul> 
       </webuijsf:form> 
      </webuijsf:body> 
     </webuijsf:html> 
    </webuijsf:page> 
</f:view> 
</jsp:root> 

誰かがJavaScriptで実際の生活の例を持っていますか？

Answer 1

AWW MAN ..私は少しタイプミスでした：それはリソース/ main.js」<ある/

 <webuijsf:script id="script1" url="resources/jquery.js"/> 
     <webuijsf:script id="script2" url="recources/main.js" /> 

を - そこにはある

：/

Answer 2

jQueryの正常に動作しますjQueryのWebサイト（Using jQuery with other Libraries）では、$（...）の代わりにjQuery.noConflict（）またはjQuery（...）を使用する必要があります。

JSFで正しく使用していることを確認してください。

たとえば、次のようにして、jQueryが他のライブラリと衝突しないようにすることができます。

var $J = jQuery.noConflict(); 

$J(<selector>)... 

RichFacesを使用している場合は、jQueryのサポートもチェックできます。

Answer 3

$ J = jQuery.noConflict（）の最適なソリューションについてはわかりません。

jQueryを使用してtextareaコンテンツを印刷するコードを作成しました。 また、私は豊富な使用：私のJSPページ内dataScrollerタグ..

二つのシナリオが発生します。

一つ、印刷作業、しかし、豊富な：dataScrollerは（）jQuery.noConflictを（使用せず）が動作しない

印刷が機能しない

第二に、豊富な：（jQuery.noConflict（）を使用して）作業dataScroller

https://stackoverflow.com/questions/2902374/how-to-integrate-jquery-with-jsf-richfaces-tags-for-print-the-image-and-textarea