Основная проблема JQuery

Question

Я только что прошел учебник по w3schools для JQuery.Я пытаюсь не написать функцию в приложении seam / richfaces.У меня есть значок поиска и щелчок на значке поиска, я хочу переключать определенные поля в пользовательском интерфейсе.Но ничего не происходит, и я не вижу никаких ошибок в firebug.Пожалуйста, помогите.

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

Answer 1

Нет класса .search-field присутствует в вашей разметке

Answer 2

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

или, если вы любите идентификаторы, вы можете сделать

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

$ = означает, что заканчивается

^ = означает, начинается с

* = означает содержит

Также я хотел бы проверить SelectorGadget для использования в Firefox.Это действительно полезно для нахождения оператора селектора, который вам нужен для получения определенного элемента.

И последнее, что я делаю, чтобы убедиться, что я нахожусь в стороне от события, - это поместить оператор предупреждения, который уходит в сторону функции.сообщить мне, что мое утверждение выбора верно.

Answer 3

jQuery("#acctListTbl:srchIcon") должно быть только jQuery("#srchIcon")

Поскольку идентификаторы уникальны на странице, их не нужно указывать.Также простой способ узнать, создает ли Jquery даже обработчик событий, - это посмотреть на ваш обработанный код и посмотреть, есть ли у вашего изображения тег JQuery="{some random numbers}".

Answer 4

Насколько я понимаю, когда вы следуете за классом или идентификатором с двоеточием, вы ищете элемент, имеющий определенное свойство, а srchIcon не является свойством.

Я считаю, что вы хотели сделатьс jQuery ('# acctListTbl: srchIcon') выглядит следующим образом: jQuery ('# acctListTbl #srchIcon)

Это означает, что цель - это элемент с идентификатором srchIcon внутри элемента с идентификатором acctList.быть частью вашей проблемы.

Надеюсь, это поможет.