豐富：UI中的jQuery：組成

Question

我試圖使用rich：faces組件：jQuery裏面的facelet組成.. 但我不能夠產生任何jQuery的調用。

<ui:composition xmlns="http://www.w3.org/1999/xhtml" 

<ui:define name="body"> 
<h:form id="f"><h:commandLink value="Go" id="ex"/> 
      <rich:jQuery selector="ex" query="alert('aw')"></rich:jQuery> 

---

另一個問題...我如何去改寫這個下跌了1號模式.. 是應用於一次性查詢立即或在一個文件準備好事件.. 對不起，但我很困惑...你可以給第一模式的另一個例子.. 希望這會啓發我... :)

Answer 1

我不知道你正在嘗試從你提供的例子做的，但也許下面將幫助：

從online documentation：

富人：jQuery的允許的風格和行爲適用於DOM對象。

據我瞭解，查詢屬性包含可以爲元素調用的jQuery函數。要對你的onclick警報，你可以做到以下幾點：

<h:commandLink value="AW1" id="x1"/> 
<rich:jQuery selector="#x1" query="click(function(){alert('test')});" /> 

從文檔更多：

豐富：

1. 爲：jQuery的可以在兩種主要模式下使用一次性查詢立即應用或在文檔準備事件中應用
2. 作爲可從JavaScript代碼調用的JavaScript函數

選擇具有「定時」屬性，該屬性具有以下 選項的模式：

1. 即時 - 立即應用的查詢;
2. onload - 加載文檔時應用查詢;
3. onJScall - 通過調用應用查詢 使用「name」屬性定義的JavaScript函數。

當「定時」屬性 的值爲「onJScall」時，「name」屬性的定義是強制性的。如果在「定時」值 等於「立即」或「加載」時定義了「名稱」屬性，則會根據此值應用查詢 ，但您仍有機會通過 函數名稱調用它。

「選擇器」屬性定義了一個對象或一個對象列表。 「查詢」屬性定義了 查詢。

有相當使用該組件的幾個不同的方式。

第一種模式是作爲立即應用或在文檔就緒事件中應用的一次性查詢。有來自在線文檔的例子。

第二種模式是你想要一個JS函數從事件中調用，例如從文檔採取：

<h:graphicImage width="50" value="/images/warning.png" onmouseover="enlargePic(this, {pwidth:'60px'})" onmouseout="releasePic(this)" /> 
<rich:jQuery name="enlargePic" timing="onJScall" query="animate({width:param.pwidth})" /> 
<rich:jQuery name="releasePic" timing="onJScall" query="animate({width:'50px'})"/> 

正如你所看到的jQuery動畫功能在查詢屬性定義和意志當鼠標懸停在圖像上時應用於圖像組件。

如果你想要當有人點擊該鏈接，那麼你就不必使用豐富時要調用的JS函數：jQuery的成分，並在你的JavaScript代碼使用jQuery。 JQuery帶有RichFaces。如果您使用的RF 3.3.3，你將不得不使用jQuery在不衝突模式：http://docs.jquery.com/Using_jQuery_with_Other_Libraries

最後看看此組件的現場演示：

http://livedemo.exadel.com/richfaces-demo/richfaces/jQuery.jsf;jsessionid=BD9D90829B8C4A9E230203856497FC9C?c=jQuery&tab=usage

UPDATE

根據您的答案中的一個提供的例子，請看看我是如何做到了以下：

<h:commandLink value="AW" id="x" onclick="testaw(this);return false;"/> 
<rich:jQuery name="testaw" timing="onJScall" query="stop().fadeOut('slow')"/> 

您會注意到我刪除了選擇器和事件屬性，這是因爲您正在嘗試執行的示例將落入我原始答案中提到的第二種模式（作爲可從JavaScript代碼調用的JavaScript函數） 。

我添加了兩個屬性「名稱」和「定時」在此模式下使用jQuery部件時是強制性的。

我還添加了一個onclick事件的鏈接（並確保返回false，因爲這部分將試圖提交表單，如果這事你不會看到jquery的效果）。

更新2

如下要求是使用適用於網頁加載一次性查詢基於您的示例工作示例：

<h:commandLink value="AW2" id="x2"/> 
<rich:jQuery selector="#x2" timing="onload" query="stop().fadeOut('slow')" /> 

另一個例子是：

<h:commandLink value="AW3" id="x3"/> 
<rich:jQuery selector="#x3" query="click(function(){jQuery(this).stop().fadeOut('slow')})" /> 

上面的問題是表單被提交。我想這想這會工作，但它並不：

<h:commandLink value="AW3" id="x3"/> 
<rich:jQuery selector="#x3" query="click(function(e){jQuery(this).stop().fadeOut('slow');e.preventDefault()});" />