我们如何在转发器中使用javascript。 [英] How we use javascript in repeater.
本文介绍了我们如何在转发器中使用javascript。的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
大家好。
我的情景就是这样。我有一个转发器和项目模板有一个跨度我从数据库得到一些日期，我想显示像客户倒计时。
我试着像这样写。< br $>
JS。
< script type = text / javascript>
jQuery（ document ）。ready（ function （）{
var _second = 1000 ;
var _minute = _second * 60 ;
var _hour = _minute * 60 ;
var _day = _hour * 24 ;
var 计时器;
$（ ＃carCampaign span）。each（ function （index，value）{
// alert（index）;
var data = $（此）。在tr（' data'）;
if （data == ' 计时器'）{
var end = $（ this ）。attr（' end'）;
var date = new 日期（端）;
function showRemaining（）{
var now = new Date （）;
var 距离=日期 - 现在;
if （距离< 0 ）{
clearInterval（计时器）;
document .getElementById（' ＃Label3' + i）.innerHTML = ' EXPIRED！';
return ;
}
var hours = 数学 .floor（（距离％_day）/ _小时）;
var minutes = Math .floor（（distance％_hour）/ _minute）;
var seconds = 数学 .floor（（距离％_minute）/ _second）;
document .getElementById（' Label3'）。innerHTML = hours + ' hrs';
document .getElementById（' Label3').innerHTML + =分钟+ ' mins';
document .getElementById（' Label3').innerHTML + =秒+ ' secs';
$（ this ）。innerHTML = hours;
}
timer = setInterval（showRemaining， 1000 ）;
}
}）;
}）;
< / script>
.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 < span class =code-attribute> class = col-md-4 search-img >
< asp：图像 ID < span class =code-keyword> = imageCar itemprop = image CssClass = img-responsive runat = server / >
< div < span class =code-attribute> class = row weight-700 > < span class = fa fa-clock-o style = padding-removed 15px; > < / span > < / div >
< div class = row >
< div class = 即将来临的插件 style = font-size：2.2em; padding-removed 15px;保证金已移除-35px; >
< asp：标签 ID = Label3 runat = server ClientIDMode = 静态 CssClass = 计时器 文字 =' <％ #Eval（ DueDateTime）％>' data = timer end =' <％＃
Eval（ DueDateTime）％>' > < span class =code-keyword>< br / >
< / asp：Label >
< asp：标签 ID = Label1 runat = 服务器 > < / asp：标签 >
< br / >
< asp：Label ID = < span class =code-keyword> Label2 runat = server / >
< / div >
< / div >
< / div >
& lt; / ItemTemplate >
< / asp：Repeater >
< / div >
但是那个时间只是第一个跨度转换为coundown另一个不起作用。
我假设每次倒计时尝试工作第一个跨度。你有什么建议吗？
解决方案
（ ＃ carCampaign span）。each（ function （index，value）{
// alert（index）;
var data =
（ this ）。attr（' data' ）;
if （data == ' timer'）{
var end =
< blockquote>（ this ）。attr（' end'）;
var date = new 日期（结束）;
function showRemaining（）{
var now = new Date （）;
var 距离=日期 - 现在;
if （距离< 0 ）{
clearInterval（计时器）;
document .getElementById（' ＃Label3' + i）.innerHTML = ' EXPIRED！';
return ;
}
var hours = 数学 .floor（（距离％_day）/ _小时）;
var minutes = Math .floor（（distance％_hour）/ _minute）;
var seconds = 数学 .floor（（距离％_minute）/ _second）;
document .getElementById（' Label3'）。innerHTML = hours + ' hrs';
document .getElementById（' Label3').innerHTML + =分钟+ ' mins';
document .getElementById（' Label3').innerHTML + =秒+ ' secs';
Hi everyone.
My scenario is that. I have a repeater and item template has a span I get some date from database and I want to show like countdown to customers.
I try to wrote like this.
JS.
<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>
.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") %>'><br />
</asp:Label>
<asp:Label ID="Label1" runat="server"></asp:Label>
<br />
<asp:Label ID="Label2" runat="server" />
</div>
</div>
</div>
</ItemTemplate>
</asp:Repeater>
</div>
But that time just first span converted to coundown another does not work.
and I assume that every time countdown try to work the first span. Do you have any suggest?
解决方案
("#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';
这篇关于我们如何在转发器中使用javascript。的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
