1

我有 ap:dataTable 并且我想创建并实现当我将鼠标悬停在一行上时，一个delete图像似乎允许我删除该行。我用PrimeFaces.escapeClientId转换jsf Id到id那个jQuery明白。这是我到目前为止得到的

<p:dataTable value=#{...} var="item">
   <p:column>
       <div onmouseover="jQuery(PrimeFaces.escapeClientId('deleteButton')).fadeIn()">
            <!-- Content of the row -->
            <p:commandButton id="deleteButton" image="delete" style="border: 0; display: none;" 
                              actionListener="#{bean.deleteRow(item)}" />
       </div>
   </p:column>
<p:dataTable>

不幸的是，它不起作用。Firebug 没有返回错误。请帮忙

4

2 回答 2

1

直接的问题是您没有在“deleteButton”周围加上引号 - 所以javascript认为它是一个变量名，而不是字符串文字。

您可以轻松地跳过整个 id 业务并仅显示，例如“当前元素内的所有 div”，通过将其作为 jQuery 上下文传递：

<p:column>
 <div onmouseover="jQuery('div', this).fadeIn()">
    to jest div
    <div style="color: wheat; background-color: green; display: none">
      <p:commandButton id="deleteButton" image="delete" style="border: 0" actionListener="#{bean.deleteRow(item)}" />
    </div>
 </div>
</p:column>

onmouseover也应该在p:column 上工作。

于 2010-12-30T21:08:24.613 回答
0

使用onmouseenterandonmouseleave代替onmouseoverandonmouseout来避免由事件冒泡引起的闪烁

例如

<div onmouseenter="jQuery('span', this).fadeIn()" 
     onmouseleave="jQuery('span', this).fadeOut()">
     ...
</div>
于 2016-02-25T05:29:37.553 回答