Runaway Ladda按钮 - 不会停止

时间:2018-02-25 22:01:06

标签: javascript ladda

我试图使用Ladda进度指示器按钮。微调器启动正常,但是当我运行setTimeout来模拟另一个函数时,它永远不会停止。

以下是代码:

<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Ladda</title>
    <link rel="stylesheet" href="css/demo.css">
    <link rel="stylesheet" href="dist/ladda.min.css">
  </head>
  <body>

    <button id="btn" class="ladda-button" data-color="gray" data-style="expand-right">Fred!</button>

    <script src="dist/spin.min.js"></script>
    <script src="dist/ladda.min.js"></script>

    <script>

      document.getElementById('btn').onclick = function() {

        var l = Ladda.create(document.querySelector('.ladda-button'));
        l.start();
        var  endIt = setTimeout(stopIt, 5000);
      }

      function stopIt() {
        l.stop();    // Also tried Ladda.stopAll();
        alert("End it All!");
      }

    </script>
  </body>
</html>

有关如何阻止这种情况的任何想法? TIA

1 个答案:

答案 0 :(得分:0)

l - 函数中不存在变量stopIt

<script>

  // Ladda variable needs to be put outside of click event or
  // the stopId-function won't be able to use it.

  var l = Ladda.create(document.querySelector('.ladda-button'));

  document.getElementById('btn').onclick = function() {
    l.start();
    var endIt = setTimeout(stopIt, 5000);
  }

  function stopIt() {
    l.stop();    // Also tried Ladda.stopAll();
    alert("End it All!");
  }

</script>