使用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

回答

相关问题