如何使时间计数器将继续刷新或离开页面

时间:2017-08-22 05:36:06

标签: javascript jquery laravel-5 counter

我在考试页面上实现了计时器计数。就像edmodo website一样。但是当你在edmodo上参加考试时,即使你刷新它,计时器仍在计算中。在我的网站上,如果刷新页面,计时器也会刷新。我想要的就像edmodo,即使你刷新页面仍然可以计算。请参阅我的代码以供参考。

注意:的 我正在使用Laravel5.1 / jQuery

using Microsoft.Win32;
 using System;
using System.Collections.Generic;
using System.Drawing;
using System.IO;
using System.Linq;
using System.Runtime.InteropServices;
using System.Text;
using System.Threading.Tasks;
using static testdesktopicons.DesktopManager;

namespace testdesktopicons
{
class Program
{
    static void Main(string[] args)
    {
        //DesktopManager.SetWallpaper(DesktopManager.Style.Stretched);
        DesktopManager.ToggleDesktopIcons();
        //DesktopManager.SetTaskbarState(AppBarStates.AutoHide);
    }
}



public static class DesktopManager
{
    const int SPI_SETDESKWALLPAPER = 20;
    const int SPIF_UPDATEINIFILE = 0x01;
    const int SPIF_SENDWININICHANGE = 0x02;
    private const int WM_COMMAND = 0x111;
    private const int SW_HIDE = 0;
    private const int SW_SHOW = 1;

    [DllImport("user32.dll", SetLastError = true)]
    static extern IntPtr FindWindow(string lpClassName, string lpWindowName);
    [DllImport("user32.dll", SetLastError = true)]
    static extern IntPtr GetWindow(IntPtr hWnd, GetWindow_Cmd uCmd);
    [DllImport("user32.dll", CharSet = CharSet.Auto)]
    //static extern int SystemParametersInfo(int uAction, int uParam, string lpvParam, int fuWinIni);
    //[DllImport("user32.dll", CharSet = CharSet.Auto)]
    static extern IntPtr SendMessage(IntPtr hWnd, UInt32 Msg, IntPtr wParam, IntPtr lParam);
    [return: MarshalAs(UnmanagedType.Bool)]
    [DllImport("user32.dll", SetLastError = true)]
    private static extern bool GetWindowInfo(IntPtr hwnd, ref WINDOWINFO pwi);
    //for taskbar hide
    [DllImport("user32.dll")]
    private static extern int ShowWindow(int hwnd, int command);
    [DllImport("user32.dll")]
    public static extern int FindWindowEx(int parentHandle, int childAfter, string className, int windowTitle);
    [DllImport("user32.dll")]
    private static extern int GetDesktopWindow();
    //auto hide taskbar



    public enum GetWindow_Cmd : uint
    {
        GW_HWNDFIRST = 0,
        GW_HWNDLAST = 1,
        GW_HWNDNEXT = 2,
        GW_HWNDPREV = 3,
        GW_OWNER = 4,
        GW_CHILD = 5,
        GW_ENABLEDPOPUP = 6
    }
    [StructLayout(LayoutKind.Sequential)]
    public struct RECT
    {
        private int _Left;
        private int _Top;
        private int _Right;
        private int _Bottom;
    }

    [StructLayout(LayoutKind.Sequential)]
    struct WINDOWINFO
    {
        public uint cbSize;
        public RECT rcWindow;
        public RECT rcClient;
        public uint dwStyle;
        public uint dwExStyle;
        public uint dwWindowStatus;
        public uint cxWindowBorders;
        public uint cyWindowBorders;
        public ushort atomWindowType;
        public ushort wCreatorVersion;
        public WINDOWINFO(Boolean? filler)
: this()   // Allows automatic initialization of "cbSize" with "new WINDOWINFO(null/true/false)".
        {
            cbSize = (UInt32)(Marshal.SizeOf(typeof(WINDOWINFO)));
        }
    }
    [StructLayout(LayoutKind.Sequential)]
    public struct APPBARDATA
    {
        public UInt32 cbSize;
        public IntPtr hWnd;
        public UInt32 uCallbackMessage;
        public UInt32 uEdge;
        public Rectangle rc;
        public Int32 lParam;
    }
    static bool AreIconsVisible()
    {
        IntPtr hWnd = GetWindow(GetWindow(FindWindow("Progman", "Program Manager"), GetWindow_Cmd.GW_CHILD), GetWindow_Cmd.GW_CHILD);
        WINDOWINFO info = new WINDOWINFO();
        info.cbSize = (uint)Marshal.SizeOf(info);
        GetWindowInfo(hWnd, ref info);
        return (info.dwStyle & 0x10000000) == 0x10000000;
    }


    public static void ToggleDesktopIcons()
    {

        Console.WriteLine("toggle desktop");

        Console.WriteLine("Icons are visible" + AreIconsVisible());
        var toggleDesktopCommand = new IntPtr(0x7402);
        IntPtr hWnd = GetWindow(FindWindow("Progman", "Program Manager"), GetWindow_Cmd.GW_CHILD);
        SendMessage(hWnd, WM_COMMAND, toggleDesktopCommand, IntPtr.Zero);
        Console.ReadLine();

    }


}
}
$(document).ready(function() {

  // Quiz timer (Start of Quiz)
  var quiz_timer = $('.quiz-timer').html();
  var exact_time = parseInt($('.timer-value').html() - 1);

  var hrs_to_spend = parseInt(exact_time / 60);
  var mins_to_spend = parseInt(exact_time % 60);
  var secs_to_spend = 60;

  var timeIsUp = false;
  var secs = 0,
    mins = 0,
    hrs = 0;
  var secs_zero, mins_zero, hrs_zero, h_spend_zero, m_spend_zero, s_spend_zero;

  var setters = setInterval(function() {

    if ($('.quiz-timer').html() != '00:00:01') {
      if (secs_to_spend > 0) {
        secs_to_spend--;
      }

      if (secs_to_spend <= 0) {
        mins_to_spend--;
        secs_to_spend = 59;
      }

      if (mins_to_spend < 0) {
        hrs_to_spend--;
        mins_to_spend = 59;
      }
    } else {
      $('.quiz-timer').html('00:00:00')
      clearInterval(setters);
      $('.answer-quiz > .panel-info').attr('class', 'panel panel-danger');
      swal({
        title: "Oops!",
        text: "Time is up.",
        type: "warning"
      });

      timeIsUp = true;
      setTimeout(function() {
        $('#submitAttempt').click();
      }, 2000);
      return false;
    }

    h_spend_zero = (hrs_to_spend < 10) ? '0' : '';
    m_spend_zero = (mins_to_spend < 10) ? '0' : '';
    s_spend_zero = (secs_to_spend < 10) ? '0' : '';

    $('.quiz-timer').html(h_spend_zero + hrs_to_spend + ':' + m_spend_zero + mins_to_spend + ':' + s_spend_zero + secs_to_spend);

    if (!timeIsUp) {
      secs++;
      if (secs == 60) {
        mins++;
        secs = 0;
      }

      if (mins == 60) {
        hrs++;
        mins = 0;
      }

      hrs_zero = (hrs < 10) ? '0' : '';
      mins_zero = (mins < 10) ? '0' : '';
      secs_zero = (secs < 10) ? '0' : '';

      $('#timeTaken').val(hrs_zero + hrs + ':' + mins_zero + mins + ':' + secs_zero + secs);
    }

  }, 1000);

});

3 个答案:

答案 0 :(得分:0)

将时间到期截止日期设为日期时间。计算剩余时间,而不是花时间。

例如,如果现在的日期时间是&#34; 2017-08-22 08:00:01&#34; (考试的开始时间),并且您希望在1小时后到期,将日期时间截止日期设置为&#34; 2017-08-22 09:00:01&#34; (这应该从服务器返回)。然后让javascript计数器每秒以刷新率(间隔)重新计算现在时间和截止时间之间的差异。

答案 1 :(得分:0)

使用本地存储空间

1)将最后一次保存在localstorage中 喜欢

window.onbeforeunload= function(){ localStorage.setItem("lastTime", timevalue); }

2)如果在localstorage中存在时间,则重新加载,如

savedTime = localStorage.getItem("lastTime");

mytimer.continueFrom(savedTime)

从那时起拿起并继续计时器

看看这里有关localstorage的信息 Local Storage

答案 2 :(得分:0)

您无法通过Javascript实现此目标,javascript代码具有会话生命周期,如果您关闭该标签,它会终止该标签使用的所有资源,包括javascript。

您可以尝试通过在local storage中保存计数器+当前时间来克服这个问题,并且每当您启动JS代码时,检查本地存储中是否存在这些值,并使用它们初始化计数器值。

let counter = prevSavedCounter + (new Date()).getTime() - savedTime;