如何停止复制进度条?

时间:2015-02-04 12:09:17

标签: javascript dom initialization progress-bar

我在这里遇到的问题是,每当我使用pos + 1更新进度条值时,它会在将进度添加到原始进度条的同时继续创建新栏。如何解决重复问题?

这是一个link来测试我的代码。

var progbar = document.createElement("PROGRESS");
progbar.id = 'progress';
progbar.setAttribute("value", "1");
progbar.setAttribute("max", "10");
document.getElementById("status").appendChild(progbar);
document.getElementById("progress").value = (pos+1);

1 个答案:

答案 0 :(得分:2)

您将获得有关您正在处理的问题的更多信息。

基本上,您只需一个脚本即可创建进度条并更新相同的进度条。如果您想在同一个脚本中执行这两项任务,则需要在创建之前检查进度条是否已在页面中。

function myFunction(){
    //Check if the progress is already in the page to avoid creating it more than once
    if (!document.getElementById("progress")){
      var x = document.createElement("PROGRESS");

      x.setAttribute("id", "progress");
      x.setAttribute("value", "22");
      x.setAttribute("max", "100");
      document.body.appendChild(x);
    }

    //Not sure where the pos value was taken from... I assumed you wanted to increase the progressbar value by 1
    document.getElementById("progress").value++;
}