Warning: file_get_contents(/data/phpspider/zhask/data//catemap/2/jquery/74.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 如何在中继器中使用标签作为倒计时_Javascript_Jquery_Asp.net - Fatal编程技术网

Javascript 如何在中继器中使用标签作为倒计时

Javascript 如何在中继器中使用标签作为倒计时,javascript,jquery,asp.net,Javascript,Jquery,Asp.net,我的设想是这样的。我有一个重复和项目模板有一个跨度(标签),我从数据库得到一些日期,我想显示像倒计时的客户 我试着这样写 <script type="text/javascript"> jQuery(document).ready(function() { var _second = 1000; var _minute = _second * 60; var _hour = _minute * 60; var _day

我的设想是这样的。我有一个重复和项目模板有一个跨度(标签),我从数据库得到一些日期,我想显示像倒计时的客户

我试着这样写

<script type="text/javascript">
    jQuery(document).ready(function() {
     var _second = 1000;
        var _minute = _second * 60;
        var _hour = _minute * 60;
        var _day = _hour * 24;
        var timer;

        $("#carCampaign span").each(function (index, value) {
            //alert(index);
            var data = $(this).attr('data');

            if (data == 'timer') {

                var end = $(this).attr('end');
                var date = new Date(end);

                function showRemaining() {
                    var now = new Date();
                    var distance = date - now;

                    if (distance < 0) {

                        clearInterval(timer);
                        document.getElementById('#Label3' + i).innerHTML = 'EXPIRED!';

                        return;
                    }
                    var hours = Math.floor((distance % _day) / _hour);
                    var minutes = Math.floor((distance % _hour) / _minute);
                    var seconds = Math.floor((distance % _minute) / _second);

                    document.getElementById('Label3').innerHTML = hours + 'hrs ';
                    document.getElementById('Label3').innerHTML += minutes + 'mins ';
                    document.getElementById('Label3').innerHTML += seconds + 'secs';
                    $(this).innerHTML = hours;


                }

                timer = setInterval(showRemaining, 1000);
            }
        });

    });
</script>

jQuery(文档).ready(函数(){
var_秒=1000;
var _minute=_second*60;
变量(小时)=(分钟)*60 ;;
var _日=_小时*24;
无功定时器;
$(“#carCampaign span”)。每个(函数(索引、值){
//警报(索引);
var data=$(this.attr('data');
如果(数据=‘计时器’){
var end=$(this.attr('end');
var日期=新日期(结束);
函数showLeving(){
var now=新日期();
var距离=日期-现在;
如果(距离<0){
清除间隔(计时器);
document.getElementById('#Label3'+i).innerHTML='EXPIRED!';
返回;
}
var小时=数学楼层((距离%\u天)/\u小时);
var分钟=数学楼层(距离%\u小时)/\u分钟);
var秒=数学楼层((距离%\u分钟)/\u秒);
document.getElementById('Label3')。innerHTML=hours+'hrs';
document.getElementById('Label3')。innerHTML+=minutes+'mins';
document.getElementById('Label3')。innerHTML+=seconds+'secs';
$(this).innerHTML=hours;
}
定时器=设置间隔(显示剩余,1000);
}
});
});
这是我的.HTML

<div id="carCampaign">
            <asp:Repeater runat="server" ID="rptOpportunities" OnItemDataBound="rptOpportunities_ItemDataBound" OnItemCommand="rptOpportunities_ItemCommand">
                <ItemTemplate>                        
                            <div class="panel-body">
                                <a href="#anyword">
                                    <div class="row">
                                        <div class="col-md-4 search-img">
                                            <asp:Image ID="imageCar" itemprop="image" CssClass="img-responsive" runat="server" />
                                            <div class="row weight-700"><span class="fa fa-clock-o" style="padding-removed 15px;"></span> </div>
                                            <div class="row">
                                                <div class="coming-soon-plugin" style="font-size: 2.2em; padding-removed 15px; margin-removed -35px;">
                                                    <asp:Label ID="Label3" runat="server" ClientIDMode="Static" CssClass="timer" Text='<%#Eval("DueDateTime") %>' data="timer" end='<%#Eval("DueDateTime") %>'>
                                                    </asp:Label>
                                                    <asp:Label ID="Label1" runat="server"></asp:Label>
                                                    <br />
                                                    <asp:Label ID="Label2" runat="server" />
                                                </div>
                                            </div>
                                        </div>
                </ItemTemplate>
            </asp:Repeater>
                </div>


但这段时间仅仅是第一个跨度转换成另一个跨度是不起作用的。
我假设每次倒计时都是第一个跨度。您有什么建议吗?

如果我理解,您希望为从repeater control中的数据库检索到的每个日期创建倒计时计时器

如果这是真的,您可以从下面提到jQuery插件获得帮助


希望能有帮助

你是对的,但是少了一些东西。我在我的页面中使用了一些插件,但我尝试使用多重倒计时?我认为你不应该将ID Label3与静态ClientIDMode一起使用,也许你可以使用文字和自定义ID生成它,并使用你制作的自定义ID,而不是静态ID,因为ID应该是唯一的。好的,我尝试不使用idmode谢谢你的回答。