在ASP.NET c#中实现在线测试系统的倒计时器

时间:2014-05-08 00:39:32

标签: c# asp.net timer countdowntimer

我正在为学生开发一个用于在线测试系统的asp.net Web应用程序。 学生参加不同科目的考试。但我无法实现计时器功能。

我为每次测试分配了30分钟。 请给出解决方案,30分钟后页面重定向到其他页面,即结果页面。 同时在网页上显示倒数计时器,只需几分钟和几秒钟。

3 个答案:

答案 0 :(得分:1)

如果您想要欺骗系统,服务器必须强制执行30分钟的限制才能将响应发布到任何给定的页面。否则,参加测试的人可以执行诸如刷新页面或禁用JavaScript以规避时间限制之类的事情。

要实现所需的UI功能(即,不允许学生在30分钟后提交页面,只让服务器端拒绝它太晚),只需使用一个过期后重定向的JavaScript计时器。

您可能还希望在页面上添加倒计时小部件,以方便学生。网上有很多例子。

答案 1 :(得分:0)

我只有VB.Net。只是尝试将其转换为C#。

在VB.Net代码:

    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
            'timer
            If Not Me.IsPostBack Then
                Dim timerStartValue As Long = 1000
                Me.timerStartValue = 120000 ' 2 minutes
                Me.TimerInterval = 1000

            End If
    End Sub

'=== TIMER FUNCTIONS ==='

    Protected Sub Page_PreInit(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.PreInit
        Dim timerVal As String = Request.Form("timerData")
        If Not String.IsNullOrEmpty(timerVal) Then
            timerVal = timerVal.Replace(",", String.Empty) ' will always be here on postback
            Me.timerStartValue = Long.Parse(timerVal)
        End If
    End Sub

    Protected Sub Page_PreRender(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.PreRender
        Dim bldr As New Text.StringBuilder()
        bldr.AppendFormat("var Timer = new myTimer({0},{1},'{2}','timerData');", Me.timerStartValue, Me.TimerInterval, Me.lblTimerCount.ClientID)
        bldr.Append("Timer.go()")

        ClientScript.RegisterStartupScript(Me.GetType(), "TimerScript", bldr.ToString(), True)
        ' used to persist current value
        ClientScript.RegisterHiddenField("timerData", timerStartValue)
    End Sub

    Private Property TimerInterval() As String
        Get
            Dim o As Object = ViewState("timerInterval")
            If Not Nothing Is o Then
                Return Integer.Parse(o.ToString())
            End If
            Return 50 ' default
        End Get
        Set(ByVal value As String)
            ViewState("timerInterval") = value
        End Set
    End Property

on .aspx code(javascript):

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.9/jquery-ui.js" type="text/javascript"></script>
<link href="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.9/themes/start/jquery-ui.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript">
    function myTimer(startVal,interval,outputId, dataField){
        this.value = startVal;
        this.OutputCntrl = document.getElementById(outputId);
        this.currentTimeOut = null;
        this.interval = interval;
        this.stopped=false;
        this.data = null;
        var formEls = document.form1.elements
        if(dataField){
            for(var i=0; i < formEls.length -1; i++){
                if(formEls[i].name == dataField){
                this.data = formEls[i];
                i = formEls.length + 1;
                                                }
                                                    }
                    }
    myTimer.prototype.go = function (){
        if(this.value > 0 && this.stopped == false){
        this.value = (this.value - this.interval);
            if(this.data){
            this.data.value = this.value;
                         }
        var current = this.value;
        this.OutputCntrl.innerHTML = "0" + this.Minutes(current) + ':' +  this.Seconds(current);
        this.currentTimeOut = setTimeout("Timer.go()", this.interval);
            }

        else             {
            $("#timesUp").dialog({
                    title: "Time is up!",
                    open: function(event, ui) { $(".ui-dialog-titlebar-close").hide(); },
                    modal: true,
                    draggable: false,
                    resizable: false
                                        });
                                      }
                                      }

    myTimer.prototype.stop = function (){
        this.stopped = true;
            if(this.currentTimeOut != null){
            clearTimeout(this.currentTimeout);
                                           }
                                        }
    myTimer.prototype.Hours = function(value){
        return Math.floor(value/3600000);
                                             }
    myTimer.prototype.Minutes = function(value){
        return Math.floor((value - (this.Hours(value)*3600000))/60000);
                                               }
    myTimer.prototype.Seconds = function(value){
        var hoursMillSecs = (this.Hours(value)*3600000)
        var minutesMillSecs = (this.Minutes(value)*60000)
        var total = (hoursMillSecs + minutesMillSecs)
        var ans = Math.floor(((this.value - total)%60000)/1000);
            if(ans < 10)
                return "0" + ans;
                return ans;
                                               }
    }
    </script>

答案 2 :(得分:0)

要实现此功能,请使用jquery倒计时器,因为它是轻量级的,并且服务器上没有额外的负载,只是它在客户端运行。 请参阅此插件Jquery Countdown Plugin。 希望这完全填满你需要的。