点击按钮后如何获得时间

时间:2017-07-03 07:07:32

标签: javascript jquery

我试图让用户点击开始按钮和停止按钮之间的时间。我能够开始和停止时间,但我无法得到时间。我使用ajax success函数来调用clearInterval函数来停止时间,这样当我成功插入数据时。时间将停止,我需要在点击停止按钮后得到时间。

我只需要获取变量cons。下面是我的代码:

$(".start").click(function() {
  var sec = 0;
  var cons = 0;
  siID = setInterval(function() {
    cons = sec++;
    console.log(cons);
  }, 1000);
});

$('.stop').click(function() {
  $.ajax({
    url: "Register_c/register_data",
    method: 'POST',
    async: false,
    data: {
      registration: {
        TIN: '123'
      }
    },
    success: function(data) {
      window.clearInterval(siID); //stops the counting
      alert(cons); //here i can't get the variable cons
    },
    error: function(xhr, status, error) {
      alert('failed');
    }
  });

3 个答案:

答案 0 :(得分:1)

正如许多人所指出的那样,您需要将cons移到全局范围内,我还建议您使用performance.now(),因为它可以提供比Date.now()更准确的时间。另一点,你想在调用AJAX请求之前知道差异,否则用户点击start然后stop然后请求结束而不仅仅是用户之间的时间差更多点击start,然后点击stop

var cons = null;

$(".start").click(function () {
    cons = performance.now();
});

$('.stop').click(function () {
    alert(performance.now() - cons); //Difference in Milliseconds

    $.ajax({
        url: "Register_c/register_data",
        method: 'POST',
        data: {
            registration: {
                TIN: '123'
            }
        },
        success: function (data) {

        },
        error: function (xhr, status, error) {
            alert('failed');
        }
    });
});



var cons = null;

$(".start").click(function() {
  cons = performance.now();
});

$('.stop').click(function() {
  console.log("Call to stop took " + ( performance.now() - cons) + " milliseconds.");
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button class="start">Start</button>
<button class="stop">Stop</button>
&#13;
&#13;
&#13;

答案 1 :(得分:0)

&#13;
&#13;
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
var sec =0;
var cons =0;
var start = $('#start').click(function() { 
  siID = setInterval(function() {
    cons = sec++;
   console.log(cons);
  }, 1000);
  return cons;
});

$('#stop').click(function() {
alert(cons);
  $.ajax({
    url: "Register_c/register_data",
    method: 'POST',
    async: false,
    data: {
      registration: {
        TIN: '123'
      }
    },
    success: function(data,start) {
      window.clearInterval(siID); //stops the counting
      alert(start); //here i can't get the variable cons
    },
    error: function(xhr, status, error) {
      alert('failed');
    }
  });
});
});
</script>
</head>
<body>

<button id="start">start</button>
<button id="stop">stop</button>
</body>
</html>
&#13;
&#13;
&#13;

我添加了启动功能,它返回缺点并能够在单击停止功能时显示警告。

答案 2 :(得分:0)

您的变量cons是一个本地范围,因此在您尝试显示它的另一种方法中不可用,这就是您应该将其移至global scope

的原因

在函数外声明的变量变为GLOBAL。

全局变量具有全局范围:网页上的所有脚本和函数都可以访问它,这就是您所需要的。

但我也建议您使用console.time(非标准)来衡量注册方法的执行时间:

console.time('someFunction');

someFunction(); // run whatever needs to be timed in between the statements

console.timeEnd('someFunction');

或者您可以使用标准performance.now() API,如下所示:

var t0 = performance.now();
doSomething();
var t1 = performance.now();
console.log("Call to doSomething took " + (t1 - t0) + " milliseconds.")

我希望这会对你有帮助..