使用jQuery內部豐富表示顯示/隱藏Div

我有一個Rich Faces表，其中包含div中的數據。我想顯示另一個div，當你將鼠標懸停在richtable行上的某一行時，顯示與該記錄相關的額外數據，並在使用jquery進行鼠標移動時隱藏div。我能夠使用jquery顯示/隱藏div。但問題是顯示/隱藏與每行相關的每個div標籤，而不是顯示/隱藏特定行的div。我如何確保只有我的鼠標懸停顯示與其關聯的div標籤的行？使用jQuery內部豐富表示顯示/隱藏Div

這裏是代碼片段：

<s:div style="float:left; "> 
    <rich:dataTable id="pendingOptyTbl" value="#{searchResultList}" 
    var="item" style="border: none; float: left;width:100%;"> 
     <rich:column style="border: none;"> 
      <s:div style="position:relative;height: 35px;"> 
      <s:div style="float:left; width: 700px; " > 
       <a4j:outputPanel style="width: 700px;" onmouseout="jQuery('accountDetails').hide();" onmouseover="jQuery('.accountDetails').show();"> 
        <s:div> 
          <h:outputText value="#{searchController.getCapitalizeName(item.label)} : " > 
        </s:div> 
       </a4j:outputPanel> 
      </s:div> 
     <s:div style="float:left;top:-10px;right:80px; width:360px;position:absolute;" styleClass="searchDetailsClass"> 
       <a4j:outputPanel id="searchDetails" ajaxRendered="true" styleClass="accountDetails">

來源

2012-11-29 user1555524

我試過這樣做... http：//livedemo.exadel.com/richfaces-demo/richfaces/jQuery.jsf ...但似乎沒有工作...任何幫助將不勝感激.. .. 。 – user1555524

所以我解決了這個使用類似的方式來自弗拉基米爾的答案，而不是id我用StyleClass做到了。我添加了styleClass =「detail - ＃{idx}」，並使用onmouseover =「jQuery（'。detail - ＃{idx}'）。show（）;」進行搜索。這將使用div的樣式類來搜索元素。每個div都有不同的styleclass，因爲有一個索引與它關聯。我希望這將有助於未來的人。僅供參考：使用Vladimir描述的Id並不適合我。

來源

2012-12-04 00:21:21 user1555524

也許不是最好的解決辦法，但你可以用行索引嘗試jQuery的ID選擇：

<h:form id="form"> 
    <rich:dataTable id="table" rowKeyVar="idx" ...> 
     <rich:column> 
     ... 
      <a4j:outputPanel onmouseover="jQuery('#form\\:table\\:#{idx}\\:searchDetails').show();" 
       onmouseout="jQuery('#form\\:table\\:#{idx}\\:searchDetails').hide();">

您可以使用Firebug找出產生的<a4j:outputPanel id="searchDetails">的ID。

來源

2012-11-30 12:52:00

使用jQuery內部豐富表示顯示/隱藏Div

回答

相關問題