0

現在、vb.net winforms プログラムを Web ベースのバージョンに移植する作業を行っていますが、元のプログラムの機能の 1 つが機能しません。

元のプログラムでは、5 分ごとにユーザー入力用のフォームがポップアップ表示されます。メイン フォームには、次のポップアップまでカウントダウンするラベル コントロールもあります。これは、1 秒間の単一のタイマー制御で実現されます。ティックごとにカウントダウンが減少し、カウントダウンが 0 に達すると、フォームがポップアップしてからリセットされます。十分に単純ですが、私の Web アプリでは、毎秒ポストバックを実行する余裕がないため、JavaScript カウントダウン ウィジェットと AJAX タイマーを組み合わせようとしています。基本的に、ページが読み込まれると、カウントダウンが 300 秒から減り始め、AJAX タイマーが 300 秒の期間で開始されます。私の考えは、タイマーが刻むと、関数が実行され、カウントダウンが再び 300 秒にリセットされるというものです。

私の問題は、私が持っているコードでカウントダウンをリセットできないことです。私は何か(おそらく非常に単純な)間違ったことをしていることを知っていますが、何を知るのに十分なJavaを知りません。

タイマー var を 300 にハードコーディングすると、カウントダウンが機能し、タイマーがカチカチ音をたてます (追加の関数を起動します) が、カウントダウンはカウントダウンを続けます (負の数になります)。コードビハインドからカウントダウン変数をリセットするにはどうすればよいですか?

カウントダウン機能はこちら

    var Timer = <%= CountDown %>;

    function updateClock() {

        // Update Countdown
        Timer -= 1;
        var TimerMin = Math.floor(Timer / 60);
        var TimerSec = Timer - (TimerMin * 60);
        TimerSec = (TimerSec < 10 ? "0" : "") + TimerSec;
        var TimerFormat = TimerMin + ":" + TimerSec;

        // Update the countdown display
        document.getElementById("javaCountdown").firstChild.nodeValue = TimerFormat
    }  

本体コードはこちら

<body onload="updateClock(); setInterval('updateClock()', 1000 )">

そしてコードビハインド

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
    Countdown = 300
End Sub

PProtected Sub Timer1_Tick(ByVal sender As Object, ByVal e As EventArgs) Handles Timer1.Tick
    Countdown = 300
    'Additional Functions
End Sub
4

1 に答える 1

0

このソリューションでは jQuery を使用します。

<script>

    var intervalSecond = null;
    var interval5minutes = null;

    $(document).ready(function() {

      // enable both intervals
      enableIntervals();

      // onsubmit event for your form
      $("#popupForm").submit(function() {

         // hide the form again
         $("#popupForm").css("display", "none");

         // enable intervals again.
         enableIntervals();
      });
    });

    function enableIntervals() {

      // every second interval
      intervalSecond = setInterval(function() {
        $("#updateMeEverySecond").html(new Date());
      }, 1000);

      // every 5 minutes interval
      interval5minutes = setInterval(function() {

        // display form and shut off the interval timers
        $("#popupForm").css("display", "block");
        clearInterval(intervalSecond);
        clearInterval(interval5minutes);
      }, 5 * 60 * 1000);
    }


</script>

<div id="popupForm" style="display:none;">
  <form>
    <input type="text" />
  </form>
</div>
<label id="updateMeEverySecond">Test</label>
于 2012-10-16T21:32:24.563 に答える