没有在gridview中显示的javascript倒计时器

Question

我已经实现了这个JavaScript与硬编码的日期，它显示正常，我已经试过它在griview，但它是显示enddate从我的数据库没有显示倒计时，但我想要从数据库中获取enddate：另外，当倒计时结束时，它应该显示一条消息：“项目结束”请朋友帮我解决。

<script type="text/javascript" src="../Scripts/jquery-3.1.1.min.js"></script> 
    <script type="text/javascript" src="../Scripts/jquery.countdown.min.js"></script> 
    <script type="text/javascript" src="../Scripts/jquery.countdown.js"></script> 


       <asp:TemplateField HeaderText="CountDown" ItemStyle-Width="300px"> 
        <ItemTemplate> 
         <div id="myCountdownClass"><%# !string.IsNullOrEmpty(Eval("EndDate").ToString()) ? Convert.ToDateTime(Eval("EndDate")).ToString("MM'/'dd'/'yyyy") : "" %></div> 
        </ItemTemplate> 
       </asp:TemplateField> 
      </Columns> 

     </asp:GridView> 

     <script type="text/javascript"> 
      $(document).ready(function() { 
       $('.myCountdownClass').each(function() { 
        var date = $(this).text(); 
        $(this).countdown(date, function (event) { 
         $(this).text(event.strftime('%D days %H:%M:%S')); 
        }); 
       }); 
      }); 

     </script> 

Answer 1

你在你的模板中指定id，但是你想在你的JavaScript（$('.myCountdownClass')）选择一类。更改此：

<div id="myCountdownClass"> 

这样：

<div class="myCountdownClass"> 

这里的工作示例（检查script.js文件）：

http://embed.plnkr.co/uffoqIjhqvvV7lzFlmzu/