Функция jquery не работает

Question

Я поместил ретранслятор, окутанный div в панели обновления. И добавьте функцию jquery на странице, чтобы добавить к ней некоторый эффект. функция jquery вызывается для каждого события page_load. он хорошо работает на тестовой странице, но не показывает никакого эффекта, когда я реализую его в главной странице моя функция JQuery является

<script type="text/javascript"> 
function pageLoad(sender, args) { 
      // JQuery code goes here 
      function domReady() { 
       $('#btn1').click(showMessage); 
       $('#btn1').trigger('click'); 
      } 
        function showMessage() { 
       $('#message').fadeOut(10); 

       $('#message').slideDown(1000); 

      }; 

    $(domReady); 
}; 
</script>} 

и HTML является

<asp:UpdatePanel ID="UpdatePanel1" runat="server"> 
    <ContentTemplate> 
     <asp:Timer ID="Timer1" runat="server" Interval="5000" ontick="Timer1_Tick"> 
     </asp:Timer> 
     <br /> 
     <div style="height:480px;overflow:scroll;"> 
     <asp:Repeater ID="Repeater1" runat="server"> 
     <ItemTemplate> 

        <div id="message" > 
        <img id="image" alt="visitors" runat="server" src="~/icon-visitors.png" height="32" width="32" /></td><td> 
         <b>A New visitor come from </b><b class="data"><%#Eval("lt_country") %></b> &nbsp;&nbsp;<%#Eval("pk_id") %> <br /> 
        &nbsp; <b>Ip :- </b><%#Eval("lt_ip") %><b>/ Browser :-</b><%#Browser(Eval("lt_browser").ToString()) %><b>/ 
        Operating System :</b><%#Os(Eval("lt_browser").ToString()) %><br /><br /> 
        </div> 
       </ItemTemplate> 
     </asp:Repeater> 
     <button id="btn1" style="visibility:hidden;"></button> 
     </div> 
    </ContentTemplate> 
    <Triggers> 
     <asp:AsyncPostBackTrigger ControlID="Timer1" EventName="Tick" /> 
    </Triggers> 
</asp:UpdatePanel> 

Answer 1

В повторителя, вместо того, чтобы использовать id на кнопку и div, используйте класс. Потому что идентификатор должен быть уникальным. Это не сработает, если вы дадите id.

Ваш скрипт и HTML должен быть изменен, как показано ниже

<script type="text/javascript"> 
function pageLoad(sender, args) { 
      // JQuery code goes here 
      function domReady() { 
       $('#btn1').click(showMessage); 
       $('#btn1').trigger('click'); 
      } 
        function showMessage() { 
       $('.message').fadeOut(10); 

       $('.message').slideDown(1000); 

      }; 

    $(domReady); 
}; 
</script> 

<asp:Repeater ID="Repeater1" runat="server"> 
     <ItemTemplate> 

        <div class="message" > 
        <img id="image" alt="visitors" runat="server" src="~/icon-visitors.png" height="32" width="32" /></td><td> 
         <b>A New visitor come from </b><b class="data"><%#Eval("lt_country") %></b> &nbsp;&nbsp;<%#Eval("pk_id") %> <br /> 
        &nbsp; <b>Ip :- </b><%#Eval("lt_ip") %><b>/ Browser :-</b><%#Browser(Eval("lt_browser").ToString()) %><b>/ 
        Operating System :</b><%#Os(Eval("lt_browser").ToString()) %><br /><br /> 
        </div> 
       </ItemTemplate> 
     </asp:Repeater> 
     <button id="btn1" style="visibility:hidden;"></button>