HTML5 Progress Bar не работает - PullRequest
       1

HTML5 Progress Bar не работает

0 голосов
/ 27 апреля 2018

Я ищу похожий вопрос, относящийся к моей проблеме, но не смог найти ни одного решения. Я делал пример индикатора выполнения в HTML5, я пробовал IE и Chrome, но кнопка GO не приводит в движение индикатор выполнения.

Вот код:

    <!DOCTYPE html>

<html lang="en">
<head>
<meta charset="utf-8"/>
<title>HTML5 Progress Bar</title>
<script type="text/javascript">
    function go();
    {
        var inc = 0;
        var doIt = setInterval(updateProgress,50);
        function updateProgress() 
        {
        inc++;
            if (inc > 100) 
            {
            document.getElementById("output").innerHTML = "Done!";
            } else 
            {
            document.getElementById("output").innerHTML = inc+ "%";
            document.getElementById("progress1").value = inc;
            }
        }
    }

    </script>

    </head>
    <body>
    <progress id = "progress1" value="0" min="0" max="100" style="width:300px;"> </progress> <br>
    <span id="output"> </span> <br> <br>
    <button id= "go" onclick="go()"> GO </button>
    </body>
    </html>

Ответы [ 2 ]

0 голосов
/ 27 апреля 2018

Проблема в том, что у вас есть точка с запятой ; после go();, она должна выглядеть как

function go() 
{
    var inc = 0;
    var doIt = setInterval(updateProgress,50);
    function updateProgress() 
    {
    inc++;
        if (inc > 100) 
        {
        document.getElementById("output").innerHTML = "Done!";
        } else 
        {
        document.getElementById("output").innerHTML = inc+ "%";
        document.getElementById("progress1").value = inc;
        }
    }
}
0 голосов
/ 27 апреля 2018

Это потому, что после функции go перед запуском фигурных скобок стоит точка с запятой ;. Попробуйте запустить фрагмент ниже.

function go() {
  var inc = 0;
  var doIt = setInterval(updateProgress, 50);

  function updateProgress() {
    inc++;
    if (inc > 100) {
      document.getElementById("output").innerHTML = "Done!";
    } else {
      document.getElementById("output").innerHTML = inc + "%";
      document.getElementById("progress1").value = inc;
    }
  }
}
<progress id="progress1" value="0" min="0" max="100" style="width:300px;"> </progress> <br>
<span id="output"> </span> <br> <br>
<button id="go" onclick="go()"> GO </button>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...