标签: countdown

Javascript 倒计时器在窗口未处于焦点时停止

好吧，我在解决这个问题时遇到了麻烦，我是一名 php / C# Web 开发人员，并且没有 Javascript 的经验或知识，我必须做这一件需要 Javascript 的事情：

当加载某个页面时，计数器就会启动。客户必须在此页面停留 20 秒。之后，我想执行php代码。

因此，有两个问题与我有关，第一：如果客户端离开页面（意味着页面没有焦点），我如何停止计数器。

2）如何在javascript中执行php？，或者从 Javascript 调用 php 函数。

到目前为止我的代码是这样的：

<html>
<head>
</head>

<body>
<div id='timer'>
<script type="text/javascript">

COUNTER_START = 20

function tick () {
    if (document.getElementById ('counter').firstChild.data > 0) {
        document.getElementById ('counter').firstChild.data = document.getElementById ('counter').firstChild.data - 1
        setTimeout ('tick()', 1000)
    } else {
        document.getElementById ('counter').firstChild.data = 'done'
    }
}

if (document.getElementById) onload = function () {
    var t = document.createTextNode (COUNTER_START)
    var p = document.createElement ('P')
    p.appendChild (t)
    p.setAttribute …

Run Code Online (Sandbox Code Playgroud)

javascript php countdown

Sha*_*ady

2012 09-22

1
推荐指数

1
解决办法

6759
查看次数

ReactJs - 倒计时意外重置

我在我的项目中使用了 Countdown，它的效果非常好。但是当我将它与简单输入结合起来时，只要我的输入发生变化，它就会重新启动。我只想在时间结束时重新启动它。这是我的代码：

import React from 'react';
import { Input } from 'reactstrap';
import Countdown from 'react-countdown-now';
import { connect } from 'react-redux';

class Foo extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      code: '',
      disabled: false,
    };
    this.update = this.update.bind(this);
  }

  update(e) {
    this.setState({ code: e.target.value });
  }

  render() {
    return (
      <div>
        <Input
          className="text-center activationCode__letter-spacing"
          maxLength="4"
          type="text"
          pattern="\d*"
          id="activationCode__input-fourth"
          bsSize="lg"
          value={this.state.code}
          onChange={this.update}
        />{' '}
        <Countdown date={Date.now() + 120000} renderer={renderer} />
      </div>
    );
  }
}

const renderer = ({ …

Run Code Online (Sandbox Code Playgroud)

countdown reactjs

Far*_*our

lucky-day

1
推荐指数

1
解决办法

1113
查看次数

从当前日期开始倒计时 5 分钟

新的反应在这里。我正在尝试输出一个倒计时器，日期设置为从现在起 5 分钟。但我所能得到的只是倒计时橡皮筋，或者 5 分钟或 0 时的静态。目前，它在 00:00:00:00 时是静态的。谢谢

编辑：我试图让它与钩子一起工作，而不是通过构造函数类。

从 './aButton' 导入 AButton；从 'react' 导入 { useState, useRef, useEffect};

export default function Countdown() {
        
        const [addTime, setAddtime] = useState();
        const [countdown, setCountdown] = useState((new Date()).toLocaleTimeString());

        const [timerDays, setDays] = useState('00');
        const [timerHours, setHours] = useState('00');
        const [timerMinutes, setMinutes] = useState('00');
        const [timerSeconds, setSeconds] = useState('00');

        let interval = useRef();

        const oldDateObject = new Date();
        const sourceDate = oldDateObject.getTime(); // date - 300000
        const diff = 5;
        //this gives use …

Run Code Online (Sandbox Code Playgroud)

javascript countdown countdowntimer reactjs react-hooks

T88*_*888

2021 04-22

1
推荐指数

1
解决办法

8917
查看次数

倒计时函数中的递归如何工作

我正在学习一些 JavaScript，但我很难理解 FreeCodeCamp 上有关递归倒计时的课程（链接）。

在课程中，有这个最初的例子。但我对它的运作方式感到困惑：

function countup(n) {
  if (n < 1) {
    return [];
  } else {
    const countArray = countup(n - 1);
    countArray.push(n);
    return countArray;
  }
}
console.log(countup(5));

Run Code Online (Sandbox Code Playgroud)

我看到这个函数执行的步骤（按顺序），如下所示：

n（开头是5）大于1，所以转到语句else。
在else语句中，我将countArray分配一个常量 () 给 do countup(n - 1)，即 4。
js 遇到的下一个操作是countArray.push(n)，因此它将把 4 压入数组中。
然后它遇到return countArray，即 4。
该函数继续 3,2,1 直到基本条件达到n==0，在这种情况下，该函数结束返回一个空数组。

我知道这不是它的工作原理，我只是“描述”我的菜鸟思维如何看待这个递归函数。

我查看了练习的解决方案和其他人的解释，但我不明白为什么该函数不像我描述的那样工作，也不明白为什么在到达后n==0，它开始填充一个从 1 到 5 计数的数组。

我想了解这一点。

javascript recursion countdown

Mog*_*shu

2021 06-02

1
推荐指数

1
解决办法

291
查看次数

反应倒计时器无法正常工作

因此，我正在为我的一个项目制作一个倒计时组件，以查看用户可以再次执行某操作之前剩余的时间。我有以秒为单位的时间差，并将秒数发送到我的倒计时组件。这就是我的倒计时组件的样子。

所以现在我什至没有使用时间差来进行测试，我只是做了 5000 秒。

    let [timerClock, setTimerClock] = useState(5000);                            
                                                                                 
    useEffect(() => {
    setInterval(function() {
        console.log("minus: ", timerClock)
        setTimerClock(timerClock - 1);
    }, 1000)
   }, [timerClock]);

Run Code Online (Sandbox Code Playgroud)

因此，在最初的 10 秒内，一切正常，但在最初的几秒钟后，它开始出现故障，无法正常工作。它会在相同的数字内上下波动，并且在两者之间开始变得更快。所以说它从 5000 开始，一旦达到 4990 左右，它将开始在 4990、4991、4993 等之间反弹，然后由于某种原因而下降，并且完全出现故障。难道我做错了什么？在我看来，它应该起作用，只是不了解发生了什么。

这是我的辅导员的图像，你可以看到它没有正确倒计时，这次它搞砸了。

debugging timer setinterval countdown reactjs

sco*_*oby

lucky-day

1
推荐指数

1
解决办法

6560
查看次数

`const char*'到`char'

我是编程新手,并试图改进我的基本倒数计时器.我不知道为什么我收到此错误,其他问题在不同情况下,因此不适合我的程序.

//countdown timer using while loops, if else, strings and sleep

#include <iostream>
#include <windows.h>
#include <string>
using namespace std;

int main ()
{
    char progend[5];
    float a; /* a will be floating point */
    cout << "Enter start the the number you want to count down from" << ".\n";

    while (a>-1) { /* the main program is located here */

        cin >> progend[5];

        if (progend[5] = "end") /* if the user inputs end the program ends */
        {
            a …

Run Code Online (Sandbox Code Playgroud)

c++ string comparison pointers countdown

Ben*_*ton

2013 10-18

0
推荐指数

1
解决办法

335
查看次数

Jpanel倒计时1小时？

好吧,我有一个计时器的Jpanel,我希望在它里面有一个倒数计时器1小时.

我真的不知道怎么做？我有一个计时器代码实现但我想从头开始编写,任何人都有模板？

我只是不能让它出现,我可以使静态文本显示为"定时器到这里",但倒计时似乎不可能.真的很感激帮助.谢谢!

private JPanel timer() {
    JPanel timerPanel = new JPanel();
    timerPanel.setMinimumSize(new Dimension(100, 100));
    timerPanel.setPreferredSize(new Dimension(100, 100));

    Countdown(timer, timer);
    JLabel timerLabel = new JLabel("TIMER GOES HERE");
    timerLabel.setFont(new Font("Franklin Gothic Medium", Font.PLAIN, 18));
    timerLabel.setAlignmentX(0);
    timerPanel.add(timerLabel);
    timerPanel.add(Box.createRigidArea(new Dimension(10, 10)));

    return timerPanel;
}

Run Code Online (Sandbox Code Playgroud)

java swing countdown countdowntimer

use*_*509

2014 04-08

0
推荐指数

1
解决办法

933
查看次数

创建倒计时器 - Java

    Timer timer = new Timer();

    TimerTask task = new TimerTask(){
        public void run(){
            for (int i = 0; i <= 30; i++){
                lblTimer.setText("" + i);
            }
        }
    };
    timer.scheduleAtFixedRate(task, 0, 1000); //1000ms = 1sec

Run Code Online (Sandbox Code Playgroud)

我创建了一个计时器,当我按下按钮时启动,上面是运行的代码.任何人都可以帮我创建一个数到30的计时器吗？现在当我运行它时,在标签中设置文本"30",但我希望它从0开始并计数到30.

java timer countdown countdowntimer netbeans-8

Jef*_*Cao

2015 08-20

0
推荐指数

1
解决办法

5836
查看次数

如何使用Android CountDownTimer倒计时一天

我是新手,也是Android开发的新手,我对Android CountDownTimer有疑问.我怎么能使用Android的CountDownTimer来计算特定的日期,比如2015年第6届Novemeber？另外,我如何将Java代码与相应的XML代码一起使用？

我在这个问题上有一个llok(如何倒计时)并且无法真正理解发生了什么？任何人都可以花一点时间来帮助我吗？

谢谢

java xml android countdown countdowntimer

Dec*_*gan

2017 05-23

0
推荐指数

1
解决办法

5067
查看次数

如何使用jQuery创建textarea倒计时？

我正在研究这个调查表,我正在尝试编写一个字符限制为500的评论区域.从我所看到的,我做的一切都是"正确的",但显然我必须忽略一些东西.

这是我的jsFiddle.

HTML

<span class="char-remain">500 Characters remaining</span>
<textarea class="comment" rows="10" cols="50" maxlength="500">Enter Text Here</textarea>

Run Code Online (Sandbox Code Playgroud)

jQuery的

comment = $(".comment");             

comment.on("keyup change", function(){

   charCount = $(this).text().length;
   charRemain = 500 - charCount;

   $(this).prev("span").text("(" + charRemain + ")");

   alert(charRemain + "Characters Remaining");

});

Run Code Online (Sandbox Code Playgroud)

警报是真的让我看看它是否正在工作或触发,但事实并非如此.我错过了什么？

html javascript jquery countdown

Shi*_*son

2015 10-12

0
推荐指数

1
解决办法

479
查看次数