2011-08-16 5 views
0

私はいくつかのカウントダウンをページに置くのに問題があります。私はHTML.Partial使用:ASP.MVC 3とHTML.Partialと複数のJqueryのカウントダウン

<span><strong id="time_h"></strong>godz. <strong id="time_m"></strong> min. <strong id="time_s"></strong>s.</span>

を私もそこにあります。そして、私は、foreachループで部分入れ

function startTime(){ 
diff = diff - 500; 

if (diff <= 0) 
{ 
    $("#time_on").hide(); 
    $("#time_off").show(); 
} else { 


    $("#time_h").html(h); 
    $("#time_m").html(checkTime(m)); 
    $("#time_s").html(checkTime(s)); 
} 

t = setTimeout('startTime()',500);} 

    function checkTime(i){ 
if (i<10) 
    { 
    i="0" + i; 
    } 
return i;} 

<script type="text/javascript"> 

    $(document).ready(startTime); 
    var datefrom = new Date(); 
    var dateto = new Date(@Model.EndDate.Year, @Model.EndDate.Month-1, @Model.EndDate.Day, @Model.EndDate.Hour, @Model.EndDate.Minute, @Model.EndDate.Second); 
    var diff = dateto.getTime() - datefrom.getTime(); </script> 

そして、私のカウントダウン機能は次のようになります。コレクションに行が1つしかない場合、すべてがうまく行きます。 1より大きい数がある場合、最初のカウントダウンがカウントされます。私がspanのidの代わりにclassを使うと(time_hなど)、各項目に同じ時刻が表示されます。良いアプローチですか?私は何を変えるべきですか?あなたは#ID to.classからあなたのセレクタを変更する必要が

おかげ カミル

答えて

0

を正常に動作します。私はそれを持っている。 intからdateへの変換の長い時間があったからです。私は今diff = diff - 1000を行い、正しく表示されます。

1

foreachループで部分コントロールをレンダリングすると、各コントロールに同じIDがレンダリングされ、#idでdomオブジェクトを取得しようとすると、最後の項目のみが影響を受けます。

このヘルプが必要です。

+0

私はこのアプローチを試みましたが、各項目で同じカウントダウンを取得しました... – Kamil

+0

@kamil thatsはクラスがすべてを選択するためです。あなただけのクラスよりも具体的にする必要があります。おそらくそれらの上に '.each()'があります。各要素に固有のidを含む要素を与えることができます。 –

0

私はこの1つを使用しよう: Jquery multi-countdown .each() function

私の部分図が見えます:

<div class="" id="2345423234"> 
    <span class="remain"></span> 
</div> 
<div class="" id="345454234"> 
    <span class="remain"></span> 
</div> 

そして、私のカウントダウン機能を:

$(document).ready(function(){ 
     $('div[id]').each(function() { 
     var $this = $(this); 
     var diff = parseInt($this.attr("id")); 
     var curDate = (new Date()).getMilliseconds(); 
     countdown = setInterval(function(){ 
      diff--; 
      var h = Math.floor(diff/3600000); 
      var m = Math.floor((diff - (h * 3600000))/60000); 
      var s = Math.floor((diff - (h * 3600000) - (m * 60000))/1000); 
      var goodDate = h + ":" + m + ":" + s; 

      $('.remain', $this).html(goodDate);  

     }, 1000); 
     }); 
    }); 

しかし、何も起こりません...それは良い表示日時はカウントダウンしません。私は

を置くとき
$('.remain', $this).html(diff);  

カウントダウンは... [OK]を

関連する問題