jjzjj

javascript - 以天、小时、分钟、秒为单位的 Javascript 倒数计时器

coder 2023-12-31 原文

我正在尝试创建一个基于时间的倒计时时钟。它不基于 current_dates。将被拉取的初始时间将来自一个单独的 php 文件。这将用于基于浏览器的游戏。当有人点击按钮启动这个脚本。它将检查是否满足某些要求，如果满足，则此脚本将启动。根据对象的级别，它将拉动该进程级别的初始计时器。希望这是有道理的。无论如何，我将计时器脚本基于我提供的第一个代码。

这个脚本只占分秒。我修改了它以包括天数和小时数。在这个过程中的某个地方，我搞砸了，脚本甚至根本不起作用。我也不太确定这是否是计算这个的最佳方法。因此，如果您有更简洁的方法，请分享。提前谢谢你。

此脚本基于我看到的分钟/秒脚本。这是原始来源:

<span id="countdown" class="timer"></span>
<script>
   var seconds = 60;
   function secondPassed() {
   var minutes = Math.round((seconds - 30)/60);
   var remainingSeconds = seconds % 60;
   if (remainingSeconds < 10) {
      remainingSeconds = "0" + remainingSeconds; 
   }
   document.getElementById('countdown').innerHTML = minutes + ":" + remainingSeconds;
   if (seconds == 0) {
    clearInterval(countdownTimer);
    document.getElementById('countdown').innerHTML = "Buzz Buzz";
   } else {
    seconds--;
   }
   }
   var countdownTimer = setInterval('secondPassed()', 1000);
</script>

这是我试图包含天、小时、分钟和秒的修改后的脚本。

<span id="countdown"></span>
<script>
     var current_level = 93578;

     function timer() {

        var days = Math.round(current_level/86400);
        var remainingDays = Math.round(current_level - (days * 86400));

        if (days <= 0){
             days = current_level;
        }

        var hours = Math.round(remainingDays/3600);
        var remainingHours = Math.round(remainingDays - (hours * 3600));

        if (hours >= 24){
             hours = 23;
        }

        var minutes = Math.round(remainingHours/60);
        var remainingMinutes = Math.round(remainingHours - (minutes * 60));

        if (minutes >= 60) {
             minutes = 59;
        }

        var seconds = Math.round(remainingMinutes/60);

        document.getElementById('countdown').innerHTML = days + ":" + hours ":" + minutes + ":" + seconds;

        if (seconds == 0) {
             clearInterval(countdownTimer);
             document.getElementById('countdown').innerHTML = "Completed";
        }
     }
     var countdownTimer = setInterval('timer()', 1000);
</script>

最佳答案

我终于回过头来看这个并重新编写了代码，这非常有效。

var upgradeTime = 172801;
var seconds = upgradeTime;
function timer() {
  var days        = Math.floor(seconds/24/60/60);
  var hoursLeft   = Math.floor((seconds) - (days*86400));
  var hours       = Math.floor(hoursLeft/3600);
  var minutesLeft = Math.floor((hoursLeft) - (hours*3600));
  var minutes     = Math.floor(minutesLeft/60);
  var remainingSeconds = seconds % 60;
  function pad(n) {
    return (n < 10 ? "0" + n : n);
  }
  document.getElementById('countdown').innerHTML = pad(days) + ":" + pad(hours) + ":" + pad(minutes) + ":" + pad(remainingSeconds);
  if (seconds == 0) {
    clearInterval(countdownTimer);
    document.getElementById('countdown').innerHTML = "Completed";
  } else {
    seconds--;
  }
}
var countdownTimer = setInterval('timer()', 1000);
<span id="countdown" class="timer"></span>

关于javascript - 以天、小时、分钟、秒为单位的 Javascript 倒数计时器，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/27182628/

计时javascriptsecondsvar34phptimercountdowntimer

有关javascript - 以天、小时、分钟、秒为单位的 Javascript 倒数计时器的更多相关文章

  1. ruby-on-rails - 使用 javascript 更改数据方法不会更改 ajax 调用用户的什么方法？ - 2

    我遇到了一个非常奇怪的问题，我很难解决。在我看来，我有一个与data-remote="true"和data-method="delete"的链接。当我单击该链接时，我可以看到对我的Rails服务器的DELETE请求。返回的JS代码会更改此链接的属性，其中包括href和data-method。再次单击此链接后，我的服务器收到了对新href的请求，但使用的是旧的data-method，即使我已将其从DELETE到POST(它仍然发送一个DELETE请求)。但是，如果我刷新页面，HTML与"new"HTML相同(随返回的JS发生变化)，但它实际上发送了正确的请求类型。这就是这个问题令我困惑的

  2. ruby - 以毫秒为单位获取当前系统时间 - 2

    在Ruby中，以毫秒为单位获取自纪元(1970)以来的当前系统时间的正确方法是什么？我试过了Time.now.to_i，好像不是我想要的结果。我需要结果显示毫秒并且使用long类型，而不是float或double。 最佳答案 (Time.now.to_f*1000).to_iTime.now.to_f显示包含十进制数字的时间。要获得毫秒数，只需将时间乘以1000。 关于ruby-以毫秒为单位获取当前系统时间，我们在StackOverflow上找到一个类似的问题：

  3. ruby - Ruby 性能中的计时器 - 2

    我正在寻找一个用ruby​​演示计时器的在线示例，并发现了下面的代码。它按预期工作，但这个简单的程序使用30Mo内存(如Windows任务管理器中所示)和太多CPU有意义吗？非常感谢deftime_blockstart_time=Time.nowThread.new{yield}Time.now-start_timeenddefrepeat_every(seconds)whiletruedotime_spent=time_block{yield}#Tohandle-vesleepinteravalsleep(seconds-time_spent)iftime_spent

  4. ruby - 在 Mechanize 中使用 JavaScript 单击链接 - 2

    我有这个:AccountSummary我想单击该链接，但在使用link_to时出现错误。我试过:bot.click(page.link_with(:href=>/menu_home/))bot.click(page.link_with(:class=>'top_level_active'))bot.click(page.link_with(:href=>/AccountSummary/))我得到的错误是:NoMethodError:nil:NilClass的未定义方法“[]” 最佳答案 那是一个javascript链接。Mechan

  5. 三分钟集成 TapTap 防沉迷 SDK（Unity 版） - 2

    三分钟集成Tap防沉迷SDK（Unity版）一、SDK介绍基于国家对上线所有游戏必须增加防沉迷功能的政策下，TapTap推出防沉迷SDK，供游戏开发者进行接入；允许未成年用户在周五、六、日以及法定节假日晚上8:00-9:00进行游戏，防沉谜时间段进入游戏会弹窗进行提示！开发环境要求：Unity2019.4或更高版本iOS10或更高版本Android5.0（APIlevel21）或更高版本🔗Unity集成Demo参考链接🔗UnityTapSDK功能体验APK下载链接二、集成前准备1.创建应用进入开发者后台,按照提示开始创建应用；2.开通服务在使用TDS实名认证和防沉迷服务之前，需要在上面创建的应

  6. ruby-on-rails - 应用程序显示错误的小时和分钟 - 2

    起初:那不是错误区域的问题。在irb和数据库中，一切都很好。当我想在我的View中显示日期(created_at、updated_at和所有由我自己在每个模型中定义的日期)时，就会出现问题。我试图在application.rb中设置时区并从初始化程序中删除时间格式，但这并没有解决我的问题。Annotategem生成的架构信息:#created_at:datetime#updated_at:datetime#publish_at:datetime来自irb:1.9.2-p290:004>Time.zone=>(GMT+00:00)UTC1.9.2-p290:005>Time.zone.n

  7. javascript - jQuery 的 jquery-1.10.2.min.map 正在触发 404(未找到) - 2

    我看到有关未找到文件min.map的错误消息:GETjQuery'sjquery-1.10.2.min.mapistriggeringa404(NotFound)截图这是从哪里来的？ 最佳答案 如果ChromeDevTools报告.map文件的404(可能是jquery-1.10.2.min.map、jquery.min.map或jquery-2.0.3.min.map，但任何事情都可能发生)首先要知道的是，这仅在使用DevTools时才会请求。您的用户不会遇到此404。现在您可以修复此问题或禁用sourcemap功能。修复:获取文

  8. ruby-on-rails - 在 Rails 中，update_attributes 的倒数是什么？ - 2

    在Rails中，update_attributes!的逆运算是什么？换句话说，是什么将记录映射到属性散列以重新创建该记录及其所有子记录？答案不是ActiveRecord.attributes，因为它不会递归到子对象中。澄清您是否有以下情况:classFoo然后你可以像这样传递一个散列{"name"=>"afoo","bars_attributes"=>[{"name"=>"abar}...]}到update_attributes。但目前尚不清楚如何为此目的以编程方式轻松生成这样的哈希值。编辑:正如我在评论中提到的，我可以做类似的事情:foo.as_json(:include=>:bar

  9. ruby-on-rails - 我将 Rails3 与 tinymce 一起使用。如何呈现用户关闭浏览器javascript然后输入xss？ - 2

    我有一个用Rails3编写的站点。我的帖子模型有一个名为“内容”的文本列。在帖子面板中，html表单使用tinymce将“content”列设置为textarea字段。在首页，因为使用了tinymce，post.html.erb的代码需要用这样的原始方法来实现。.好的，现在如果我关闭浏览器javascript，这个文本区域可以在没有tinymce的情况下输入，也许用户会输入任何xss，比如alert('xss');.我的前台会显示那个警告框。我尝试sanitize(@post.content)在posts_controller中，但sanitize方法将相互过滤tinymce样式。例如

  10. ruby - 使用 Selenium WebDriver 启用/禁用 javascript - 2

    出于某种原因，我必须为Firefox禁用javascript(手动，我们按照提到的步骤执行http://support.mozilla.org/en-US/kb/javascript-settings-for-interactive-web-pages#w_enabling-and-disabling-javascript)。使用Ruby的SeleniumWebDriver如何实现这一点？ 最佳答案 是的，这是可能的。而是另一种方式。您首先需要查看链接Selenium::WebDriver::Firefox::Profile#[]=

随机推荐