它本身很好用,但是当我把它放在我的表格的其余部分时会爆炸

时间:2013-07-06 17:36:05

标签: javascript html forms time stopwatch

我已经破解了一个秒表脚本,使其在我的HTML表单中的几次迭代中可用。它使用id标签来识别我按下哪个按钮来开始,结束和重置计时器,将当前时间发布到这些字段并在第3个字段中运行秒表。这样做的原因是,将通过表格跟踪12个重要制造流程的开始/结束/持续时间。

我是在'独立'HTML文件的上下文中编写的,以便测试可行性并且它工作得很好......但是......当我将代码粘贴到我的表单中时(这是认真的太大了,无法在这里发布)并按下“开始”按钮 - 我将文本发布到我的“秒表”字段,然后我的页面刷新。

以下是发布到我的字段的文本,我可以阅读(如果有必要,我将扩展字段以捕获更多文本)和HTML,并使用我编写的javascript代码。

发表文字:function hour(serial_number){if(!isFinite(serial_number))return ....

代码我把它放在一起:

<html>
<head>
<script type="text/javascript">

var sec = 0;
var mins = 0;
var hour = 0;

function duration(ctrlID){
  ctrlbtnID=(ctrlID)
  var cbtnVal=document.getElementById(ctrlbtnID).value;

  if(cbtnVal=='Begin'){
    document.getElementById(ctrlbtnID).value='End';
    var currentTime = new Date()
    var hours = currentTime.getHours()
    var minutes = currentTime.getMinutes()
    var seconds = currentTime.getSeconds()

    if (minutes < 10) {minutes = "0" + minutes}
    if (seconds < 10) {seconds = "0" + seconds}
    bTime= hours + ":" + minutes + ":" + seconds + " "
    document.getElementById(ctrlbtnID+"Start").value = bTime
  }  //end of if block
  else if(cbtnVal=='End'){
    document.getElementById(ctrlbtnID).value='Begin';
    var currentTime = new Date()
    var hours = currentTime.getHours()
    var minutes = currentTime.getMinutes()
    var seconds = currentTime.getSeconds()

    if (minutes < 10) {minutes = "0" + minutes}
    if (seconds < 10) {seconds = "0" + seconds}
    eTime= hours + ":" + minutes + ":" + seconds + " "
    document.getElementById(ctrlbtnID+"End").value = eTime
  }
  stopwatch();
}
function stopwatch(){
  var x=document.getElementById(ctrlbtnID).value;
  if (x=='End'){
    sec++;
  if (sec == 60) {
    sec = 0;
    mins = mins + 1;
  }
  else {
   mins = mins;
  }  
  if (mins == 60) {
    mins = 0;
    hour += 1;
  }
  if (sec<=9) {
    sec = "0" + sec;
  }
  var swTime=document.getElementById(ctrlbtnID+"Dur");

  swTime.value= ((hour<=9) ? "0"+hour : hour) + " : " + ((mins<=9) ? "0" + mins : mins) + " : " + sec;
  SD=window.setTimeout("stopwatch();", 1000);
  }
}
function reset(){
  var swTime=document.getElementById(ctrlbtnID+"Dur");
  sec = 0;
  mins = 0;
  hour = 0;
  swTime.value='00 : 00 : 00';
  document.getElementById(ctrlbtnID+"Start").value ='00 : 00 : 00';
  document.getElementById(ctrlbtnID+"End").value ='00 : 00 : 00';
}
</script>
</head> 
<body>
<input type="button" value="Begin" id="1_1"  onClick="duration(this.id)"/>
<input type="button" value="Reset" id="reset"  onClick="reset()"/>
<input type="text" value="00 : 00 : 00" id="1_1Dur"/>
<input type="text" value="00 : 00 : 00" id="1_1Start"/>
<input type="text" value="00 : 00 : 00" id="1_1End"/>
</body>
</html>

我几天前在这里发布了我的第一个问题 - 我已经找到了自己的问题 - 但是我希望我会对这个问题有更好的回应......我已经挖过了我现在可以找到大约2天的所有在线资源,但却找不到任何东西。

请 - 我可以使用一些帮助。

由于

2 个答案:

答案 0 :(得分:0)

好吧,如果没有至少部分有问题的表格,我认为我们不能帮助你。我可以确认该代码是一个独立的HTML文件,但我不知道打印文本的来源(在您提供的代码中找不到它)。

检查您的document.getElementById(problemFormId)来电...您可能自己将字段设置为文本变量,而没有意识到。

答案 1 :(得分:0)

显然,你在某个地方有一个hour(serial_number)函数,覆盖你的全局小时变量。所以请重命名函数或变量。

对于'reset()'函数,请告诉我们它是否被调用,或者它是否抛出错误,以及哪一个。