hinzugefügt Daten in p: dataScroller verloren Javascript-Funktion

Question

Ich benutze p:dataScroller mit 10 Chunk Größe, aber auf meinem Inhalt von jedem Element, ich bin eine Klasse hinzufügen, es eine Click-Event-Funktion, wenn ich die Seite laden, meine Funktion Veranstaltung nur mit den 10 ersten Artikel funktioniert, das ist mein Code

<h:form> 
        <p:dataScroller widgetVar="dScroller" value="#{documentalBean.listdocumental}" var="documental" chunkSize="10"> 
          <div id="#{documental.ID_DOCUMENTAL}" class="resultados-filtro"> 
           <div class="item-filtro"> 
            <div> 
             <img src="someimage" alt="" /> 
             <div> 
              <h3>Text</h3> 
              <p><span>Text</span></p> 
              <p>Text</p> 
              <p><span>text</span> Text</p> 
              <p><span>text</span> Text</p> 
             </div> 
            </div> 
           </div> 
           <div></div> 
          </div> 
        </p:dataScroller> 
       </h:form> 

Mein Javascript Event:

$(".resultados-filtro").click(function() { 
       alert("event"); 
      }); 

Wenn ich nach unten scrollen und die nächsten 10 Zeilen geladen werden, reagieren sie nicht auf dem Klick Funktion

Answer 1

Ich habe ähnliche dataScroller + Javascript Probleme erlebt. Eine Arbeit, die wir angestellt haben, bestand darin, Ihr Javascript in eine Funktion zu bringen und diese mit onclick-Attributen im Element aufzurufen.

<p:dataScroller widgetVar="dScroller" value="#{documentalBean.listdocumental}" var="documental" chunkSize="10"> 
    <div onclick="alertClick()" id="#{documental.ID_DOCUMENTAL}" class="resultados-filtro"> 
     ... 
    </div> 
</p:dataScroller> 
<script type="text/javascript"> 
    function alertClick() { 
     $(".resultados-filtro").click(function() { 
      alert("event"); 
     }); 
    } 
</script>