2011-08-26 51 views
0

我刚刚通过w3schools教程JQuery。我试图在seam/richfaces应用程序中写一个函数。我有一个搜索图标和onclick搜索图标,我想切换UI中的某些字段。但没有任何反应,我没有看到萤火虫的任何错误。请帮忙。基本的jQuery问题

<rich:dataTable id="acctListTbl" value="#{accounts}" var="account" width="100%"> 
    <rich:column> 
    <f:facet name="header"> 
    <h:panelGroup> 
     <h:graphicImage id="srchIcon" value="/images/search_icon.png" 
          styleClass="search-icon"/> 
      <h:outputText value="Action" /> 
     </h:panelGroup> 
    </f:facet> 

<script type="text/javascript"> 
    jQuery(document).ready(function(){ 
    jQuery("#acctListTbl:srchIcon").click(function(){ 
     jQuery('.search-field').toggle(); 
    }); 
}); 
</script> 

这里是html。正如user914670指出的那样,我的搜索图标呈现中没有添加jQuery处理程序。那么,什么是错的?

<div id="j_id12:acctListTbl:j_id31header:sortDiv"> 
    <img id="j_id12:acctListTbl:srchIcon" class="search-icon" 
     src="/xxxx/images/search_icon.png"> 
     Action 
</div> 
+4

你可以显示呈现的HTML而不是生成它的服务器端代码吗? – lonesomeday

+3

我没有看到类.search-field –

+7

的元素我不推荐使用w3schools作为jQuery资源。 http://w3fools.com –

回答

0
jQuery(document).ready(function(){ 
     jQuery(".search-icon").click(function(){  
       jQuery('.search-field').toggle();  
     }); 
}); 

,或者如果你喜欢的ID,你可以做

jQuery(document).ready(function(){ 
     jQuery("[id$=srchIcon]").click(function(){  
       jQuery('.search-field').toggle();  
     }); 
}); 

$ =意味着,

结束^ =意味着

开始* =是指包含

而且我会检查出SelectorGadget用于Firefox。它非常适合查找需要获取某个元素的选择器语句。我这样做,以确保我在侧放,在一侧熄灭功能,让我知道我的选择说法是正确的警报语句事件

最后一两件事。

+0

这两个语句都可以正常工作。非常感谢。 – user238021

2

无级.search-field出现在您的标记

+0

。搜索字段在xhtml中可用。如果我用onclick替换Jquery =“toggleSearchFields();”并写入JavaScript,事情很好。函数toggleSearchFields(){jQuery('。search-field')。toggle(); } – user238021

0

我的理解是,当你按照一类或用冒号的ID,你正在寻找,并具有特定性,srchIcon不是元素属性。

我相信你的意思是用jQuery的( '#acctListTbl:srchIcon')做什么如下:
的jQuery('#acctListTbl #srchIcon)

,说目标是一个元素在具有acctList ID的元素内部具有srchIcon的ID。

这可能是你的问题的一部分。

希望有所帮助。

0

jQuery("#acctListTbl:srchIcon")仅需要jQuery("#srchIcon")

因为ID是在页面上独一无二的,他们不需要为合格。另外一个判断Jquery是否创建事件处理程序的简单方法是查看您的呈现代码并查看您的图像是否有JQuery="{some random numbers}"标记。

+0

我试过#srchIcon。但它不起作用。 – user238021

+0

事件处理程序没有被创建。任何想法为什么? – user238021

+0

你可以发布你的图像呈现的HTML吗? – Slick86