51Testing软件测试论坛

标题: 我写的这段html不知道哪里出现了问题 [打印本页]

作者: gyz644 时间: 2018-11-28 13:19
标题: 我写的这段html不知道哪里出现了问题
本帖最后由 gyz644 于 2018-11-28 13:20 编辑

需求：点击下载按钮，进度条会在2s时前进至50%，4s时前进至70%，6s时前进至100%

我写的这段html不知道哪里出现了问题，点击下载按钮，进度条没有前进，请老师指点一下

<!DOCTYPE html>

<html>

<head>

<title>Insert title here</title>

function changetime(){

var t1=setTimeout("document.getElementById("1").value='50'",2000);

var t2=setTimeout("document.getElementById("1").value='70'",4000);

var t3=setTimeout("document.getElementById("1").value='100'",6000);

}

</script>

</head>

<body>

<form>

</form>

</body>

</html>

在学课程：

Web前端必备HTML5教程

http://www.atstudy.com/course/999

作者: 学掌门网校 时间: 2018-11-28 14:23
<!DOCTYPE html>

<html>

<head>
      <meta charset="UTF-8">
      <title>Insert title here</title>
      <script>
         function changetime(e){
            e.preventDefault();

            var t1=setTimeout(
                  function(){
                                 document.getElementById("1").value = "50";
                              },2000);

            var t2=setTimeout(
                  function(){
                                    document.getElementById("1").value = "70";
                              },4000);

            var t3=setTimeout(
                  function(){
                                 document.getElementById("1").value = "100";
                              },6000);
         }
      </script>
</head>
<body>
      <form>
         <progress value="25" max="100" id="1"></progress>
         <button onclick="changetime(event)">下载</button>
      </form>
</body>
</html>
同学你好，编辑时需要注意HTML5本身的缩进结构；

另外document.getElementById("1").value = "70" 需要以一个方法function的形式来获取返回值，而非直接作为参数；

另外此处e.preventDefault()表示默认表单是不被提交的

欢迎光临 51Testing软件测试论坛 (http://bbs.51testing.com/)