other progress

来源:互联网 发布:unity3d 广告sdk 编辑:程序博客网 时间:2024/05/13 03:20

 <html>
<head>
 <script type="text/javascript" src="./dojo/dojo.js"
  djConfig="parseOnLoad: true, isDebug: true"></script>
  
 <script language="JavaScript" type="text/javascript">
  dojo.require("dijit.ProgressBar");
  dojo.require("dojo.parser"); // scan page for widgets
  dojo.require("dojo.string"); 
 </script>
 
 <style type="text/css">
  @import "./dojo/resources/dojo.css";
  @import "./dijit/themes/tundra/tundra.css";
  @import "./dijit/themes/tundra/tundra_rtl.css";
  @import "./dijit/tests/css/dijitTests.css";
 </style> 
 
 <script type="text/javascript">

  dojo.addOnLoad(go);

  function go(){
   //TODO: it's a little strange that id must be specified again? 
   var theBar = new dijit.ProgressBar({id: "testBar", width: 400, annotate: true, maximum: 256, duration: 2000,
    report:function(percent){
     return dojo.string.substitute("${0} out of ${1} max chars", [this.progress, this.maximum]);
    }
   }, dojo.byId("testBar"));
   dojo.byId("progressValue").focus();
   dojo.byId("progressValue").value = dijit.byId("setTestBar").progress;
   dojo.byId("maximum").value = dijit.byId("setTestBar").maximum;
   dojo.connect(dojo.byId("set"), "onclick", null, setParameters); //此处将按钮与事件绑定
   dojo.connect(dojo.byId("startTimer"), "onclick", null,
    function(){ remoteProgress(dijit.byId("timerBar")); } );

   function indeterminateSetter(id, value){
    return function(){
     dijit.byId(id).update({'indeterminate': value});
    }
   }
   dojo.connect(dojo.byId("setIndeterminate1True"), "onclick", null,
    indeterminateSetter("indeterminateBar1", true));
   dojo.connect(dojo.byId("setIndeterminate1False"), "onclick", null,
    indeterminateSetter("indeterminateBar1", false));
   dojo.connect(dojo.byId("setIndeterminate2True"), "onclick", null,
    indeterminateSetter("indeterminateBar2", true));
   dojo.connect(dojo.byId("setIndeterminate2False"), "onclick", null,
    indeterminateSetter("indeterminateBar2", false));
  }

  var fakeProgress = 0;
  function getProgressReport(){
   var deferred = new dojo.Deferred();
   fakeProgress = Math.min(fakeProgress + 10, 100);
   deferred.callback(fakeProgress+"%");
   return deferred;
  }

  function remoteProgress(bar){
   var _timer = setInterval(function(){
    var report = getProgressReport();
    report.addCallback(function(response){
     bar.update({progress: response});
     if(response == "100%"){
      clearInterval(_timer);
      _timer = null;
      return;
     }
    });
   }, 3000); // on 3 second intervals
  }

  function setParameters(){
   dijit.byId("setTestBar").update({maximum: dojo.byId("maximum").value, progress: dojo.byId("progressValue").value});//此处设置进度条数值
  }

  </script>    
</head>
<body class="tundra">
 Progress Value <input type="text" name="progressValue" id="progressValue" />
 <br>
 Max Progress Value <input type="text" name="maximum" id="maximum" />
 <br>
 <input type="button" name="set" id="set" value="set!" />
 <br>
 <div style="width:400px" annotate="true"
  maximum="200" id="setTestBar" progress="20" dojoType="dijit.ProgressBar"></div>
</body>
</html>

原创粉丝点击