为什么我的闹钟脚本停止工作?

问题描述:

它只能工作一次。在第二次按钮点击时,什么都不会发生为什么我的闹钟脚本停止工作?

如果我更改budilnik变量i_budilnikvar budilnik,它甚至不能运行一次!

问题在哪里?

<div> 
<form name="alert"> 
    <input type="text" name="hour" /> 
    <input type="text" name="min" /> 
    <input type="button" value="ok" onclick="budilnik(this.form)"> 
</form><font color=#660000 size=20 face=Tahoma><span id="hours"></span> 
</div> 

<script type="text/javascript"> 


function budilnik(form) { 
    budilnik = 1; 
    min = form.min.value; 
    hour = form.hour.value; 
} 

obj_hours = document.getElementById("hours"); 

function wr_hours() { 
    time = new Date(); 

    time_min = time.getMinutes(); 
    time_hours = time.getHours(); 
    time_wr = ((time_hours < 10) ? "0" : "") + time_hours; 
    time_wr += ":"; 
    time_wr += ((time_min < 10) ? "0" : "") + time_min; 

    time_wr = time_wr; 

    obj_hours.innerHTML = time_wr; 

    if (i_budilnik == 1) { 

     if (min == time_min) { 
      if (hour == time_hours) { 
       alert('welldone'); 
       budilnik = 0; 
      } 
     } 
    } 
} 
wr_hours(); 
setInterval("wr_hours();", 1000); 
</script> 
+0

对于time_wr = time_wr抱歉; 调试跳转后不敢删除=) – butteff 2010-03-21 08:41:28

您可以调用函数wr_hours();只有一次...与onclick budilnik被称为,但那不再触及wr_hours。代码首次运行时,因为页面已加载,但在此之后,onclick只会再次设置min和hour的值。

编辑:你不应该调用你的表单“alert”,因为这是javascript中的保留字,对于变量min也是如此。另外:变量min和hour在函数budilnik中定义,但它们在此范围之外是未知的。我还将变量budilnik更名为全局变量justonce,以确保您可以在budilnik范围之外检查它。我改写了你的代码位:

<html> 
<body> 
    <div> 
     <form name="frm"> 
      <input type="text" name="hour" /> 
      <input type="text" name="mins"/> 
      <input type="button" value="ok" onclick="justonce=1;"> 
     </form> 
     <font color=#660000 size=20 face=Tahoma><span id="hours"></span></font> 
    </div> 
</body> 
</html> 

<script type="text/javascript"> 
obj_hours=document.getElementById("hours"); 
justonce=0; 

function wr_hours() 
{ 
    time=new Date(); 

    time_min=time.getMinutes(); 
    time_hours=time.getHours(); 

    time_wr=((time_hours<10)?"0":"")+time_hours; 
    time_wr+=":"; 
    time_wr+=((time_min<10)?"0":"")+time_min; 

    obj_hours.innerHTML=time_wr; 

    if (justonce==1 && frm.mins.value==time_min && frm.hour.value==time_hours) { 
      alert('welldone'); 
      justonce=0; 
    } 
} 

setInterval("wr_hours();",1000); 
</script> 

你的功能wr_hours可能的方式缩短了不少:

function wr_hours() 
{ 
    time=new Date(); 

    obj_hours.innerHTML=("%02d",time.getHours())+":"+("%02d",time.getMinutes()); 

    if (justonce==1 
     && frm.mins.value==time.getMinutes() 
     && frm.hour.value==time.getHours()) { 
     alert('welldone'); 
      justonce=0; 
    } 
} 
+0

这个脚本必须点击调用函数。但它不工作。为什么?? function budilnik(form) { budilnik = 1; min = form.min.value; hour = form.hour.value; wr_hours(); setInterval(“wr_hours();”,1000); } – butteff 2010-03-21 09:19:06

+0

peraphs不会忘记将设置间隔更改为** setInterval(“wr_hours”,1000); **无括号! – 2010-03-21 09:36:21

+0

编辑源在我的电脑上不起作用。可能是我必须安装的东西?我认为,那个代码是exerent的,可能是我的电脑不正确? – butteff 2010-03-21 11:03:53

如何

样?

在这段代码中你听不到“报警”,所以你必须下载你喜欢的声音,重写一段代码。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 
<HTML> 
<HEAD> 
<META http-equiv="Content-Type" content="text/html; charset=shift_jis"> 
<meta http-equiv="Content-Style-Type" content="text/css"> 
<meta http-equiv="Content-Script-Type" content="text/javascript"> 

<bgsound id="bgm" src="222.mid" loop="-1"> 

<TITLE>Yokai clock~The digital clock changes to the analogue one!?~</TITLE> 


<SCRIPT type="text/javascript"> 
<!-- 

var flg =0; 

function timeCheck(){ 

    Now = new Date(); 
    Hour = Now.getHours(); 
    Min = Now.getMinutes(); 
    Sec = Now.getSeconds(); 

     if(Hour <= 9) { 
         Hour = "\u0020" + Hour; 
  }   
    if(Min <= 9) { 
         Min = "0" + Min; 
  } 
     if(Sec <= 9) { 
         Sec = "0" + Sec; 
  } 

    document.sampleForm.dspTime.value=Hour + ":" + Min + ":" + Sec; 


if((flg == 1)&&(document.sampleForm.alarmH.value == Hour)&&(document.sampleForm.alarmM.value == Min)){ 
document.getElementById('bgCol').value="333.wav", selectBgm(document.getElementById('bgCol')), 
document.getElementById('star_clock').style.visibility="hidden", document.getElementById('clock').style.visibility="visible"; 
flg=-1; //*One figure other than 0 and 1 
  } 
} 


function changeFlg(){ 
    if(flg == 0){ 
    document.sampleForm.setAlarm.value=" alarmOFF "; 
       document.getElementById("bgCol").value=""; 
        selectBgm(document.getElementById('bgCol')); 
          flg =1; 
    }else{ 
     document.sampleForm.setAlarm.value=" alarm ON "; 
       document.getElementById("bgms").reset(); 
       selectBgm(document.getElementById('bgCol')); 
       document.getElementById('star_clock').style.visibility="visible"; 
       document.getElementById('clock').style.visibility="hidden"; 
       flg =0; 
    } 
} 

     setInterval(timeCheck,100); 
       window.onload = timeCheck; 
//--> 
</SCRIPT> 

<script type="text/javascript"> 
<!-- 
    function selectBgm(e){ 
    var selectedIndex = e.selectedIndex; 
     document.getElementById("bgCol").style.background=e[selectedIndex].style.backgroundColor; 
     bgm.src= e[selectedIndex ].value; 
     document.getElementById("bgCol").value=e[selectedIndex].value; 
} 

//--> 
</script> 
</head> 


<BODY color="gold" bgcolor="black"> 


<div id="clock" style="visibility:hidden"> 
    <div id="Od" style="position:absolute;top:0px;left:0px"> 
     <div style="position:relative"> 
     </div> 
    </div> 
    <div id="Of" style="position:absolute;top:0px;left:0px"> 
     <div style="position:relative"> 
     </div> 
    </div> 
    <div id="Oh" style="position:absolute;top:0px;left:0px"> 
     <div style="position:relative"> 
     </div> 
    </div> 
    <div id="Om" style="position:absolute;top:0px;left:0px"> 
     <div style="position:relative"> 
     </div> 
    </div> 
    <div id="Os" style="position:absolute;top:0px;left:0px"> 
     <div style="position:relative"> 
     </div> 
    </div> 
</div> 

<script type="text/javascript"> 

(function(){ 
    "use strict"; 

function $(sel) 
{ 
    return document.getElementById(sel); 
} 

function $$(sel) 
{ 
    if (typeof document.getElementsByClassName === 'undefined') 
    { 
     return document.getElementsByName(sel); 
    } 
    return document.getElementsByClassName(sel); 
} 

var dCol = '00ff00', //date colour. 
    sCol = 'ff0000', //seconds colour. 
    mCol = '008000', //minutes colour. 
    hCol = '008000', //hours colour. 
    fCol = '0000ff', //face color 
    ClockHeight = 40, 
    ClockWidth = 40, 
    ClockFromMouseY = 0, 
    ClockFromMouseX = 100, 
    d = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"], 
    m = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"], 
    date = new Date(), 
    day = date.getDate(), 
    year = date.getYear() + 1900; 

var TodaysDate = " " + d[date.getDay()] + " " + day + " " + m[date.getMonth()] + " " + year; 
var D = TodaysDate.split(''); 
var H = '...'; 
    H = H.split(''); 
var M = '....'; 
    M = M.split(''); 
var S = '.....'; 
    S = S.split(''); 
var Face = '1 2 3 4 5 6 7 8 9 10 11 12', 
    font = 'Helvetica, Arial, sans-serif', 
    size = 1, 
    speed = 0.6; 
    Face = Face.split(' '); 
var n = Face.length; 
var a = size * 10; 
var ymouse = 0, 
    xmouse = 0, 
    scrll = 0, 
    props = '<span style="font-family:' + font + ';font-size:' + size + 'em; color:#' + fCol + '">', 
    props2 = '<span style="font-family:' + font + ';font-size:' + size + 'em; color:#' + dCol + '">'; 
var Split = 360/n; 
var Dsplit = 360/D.length; 
var HandHeight = ClockHeight/4.5; 
var HandWidth = ClockWidth/4.5; 
var HandY = -7, 
    HandX = -2.5, 
    step = 0.06, 
    currStep = 0, 
    y = [], 
    x = [], 
    Y = [], 
    X = [], 
    Dy = [], 
    Dx = [], 
    DY = [], 
    DX = []; 
var i; 

for (i = 0; i < n; i++) 
{ 
    y[i] = 0; 
    x[i] = 0; 
    Y[i] = 0; 
    X[i] = 0; 
} 

for (i = 0; i < D.length; i++) 
{ 
    Dy[i] = 0; 
    Dx[i] = 0; 
    DY[i] = 0; 
    DX[i] = 0; 
} 

var wrapper = $('clock'); 
var html = '' 
// Date wrapper 

html = ''; 

for (i = 0; i < D.length; i++) 
{ 
    html += '<div class="Date" name="Date" style="position:absolute;top:0px;left:0;height:' + a + ';width:' + a + ';text-align:center">' + props2 + D[i] + '</span></div>'; 
} 

$('Od').children[0].innerHTML = html; 
// Face wrapper 
html = ''; 

for (i = 0; i < n; i++) 
{ 
    html += '<div class="Face" name="Face" style="position:absolute;top:0px;left:0;height:' + a + ';width:' + a + ';text-align:center">' + props + Face[i] + '</span></div>'; 
} 

$('Of').children[0].innerHTML = html; 
// Hours wrapper 
html = ''; 

for (i = 0; i < H.length; i++) 
{ 
    html += '<div class="Hours" name="Hours" style="position:absolute;width:16px;height:16px;font-family:Arial;font-size:16px;color:' + hCol + ';text-align:center;font-weight:bold">' + H[i] + '</div>'; 
} 

$('Oh').children[0].innerHTML = html; 
// Minute wrapper 

html = ''; 

for (i = 0; i < M.length; i++) 

{ 

    html += '<div class="Minutes" name="Minutes" style="position:absolute;width:16px;height:16px;font-family:Arial;font-size:16px;color:' + mCol + ';text-align:center;font-weight:bold">' + M[i] + '</div>'; 

} 

$('Om').children[0].innerHTML = html; 



// Seconds wrapper 

html = ''; 

for (i = 0; i < S.length; i++) 

{ 

    html += '<div class="Seconds" name="Seconds" style="position:absolute;width:16px;height:16px;font-family:Arial;font-size:16px;color:' + sCol + ';text-align:center;font-weight:bold">' + S[i] + '</div>'; 

} 

$('Os').children[0].innerHTML = html; 



// Mouse move event handler 

function Mouse(evnt) 

{ 

    if (typeof evnt === 'undefined') 

    { 

     ymouse = event.Y + ClockFromMouseY; 

     xmouse = event.X + ClockFromMouseX; 

    } 
    else 
    { 
     ymouse = evnt.clientY + ClockFromMouseY; 
     xmouse = evnt.clientX + ClockFromMouseX; 
    } 
} 

document.onmousemove = Mouse; 

function ClockAndAssign() 

{ 
    var time = new Date(); 
    var secs = time.getSeconds(); 
    var sec = -1.57 + Math.PI * secs/30; 
    var mins = time.getMinutes(); 
    var min = -1.57 + Math.PI * mins/30; 
    var hr = time.getHours(); 
    var hrs = -1.575 + Math.PI * hr/6 + Math.PI * parseInt(time.getMinutes(), 10)/360; 

    $('Od').style.top = window.document.body.scrollTop; 
    $('Of').style.top = window.document.body.scrollTop; 
    $('Oh').style.top = window.document.body.scrollTop; 
    $('Om').style.top = window.document.body.scrollTop; 
    $('Os').style.top = window.document.body.scrollTop; 

    for (i = 0; i < n; i++) 
    { 
     var F = $$('Face')[i]; 
     F.style.top = y[i] + ClockHeight * Math.sin(-1.0471 + i * Split * Math.PI/180) + scrll; 
     F.style.left = x[i] + ClockWidth * Math.cos(-1.0471 + i * Split * Math.PI/180); 
    } 

    for (i = 0; i < H.length; i++) 
    { 
     var HL = $$('Hours')[i]; 
     HL.style.top = y[i] + HandY + (i * HandHeight) * Math.sin(hrs) + scrll; 
     HL.style.left = x[i] + HandX + (i * HandWidth) * Math.cos(hrs); 
    } 

    for (i = 0; i < M.length; i++) 
    { 
     var ML = $$('Minutes')[i].style; 
     ML.top = y[i] + HandY + (i * HandHeight) * Math.sin(min) + scrll; 
     ML.left = x[i] + HandX + (i * HandWidth) * Math.cos(min); 
    } 

    for (i = 0; i < S.length; i++) 
    { 
     var SL = $$('Seconds')[i].style; 
     SL.top = y[i] + HandY + (i * HandHeight) * Math.sin(sec) + scrll; 
     SL.left = x[i] + HandX + (i * HandWidth) * Math.cos(sec); 
    } 

    for (i = 0; i < D.length; i++) 
    { 
     var DL = $$('Date')[i].style; 
     DL.top = Dy[i] + ClockHeight * 1.5 * Math.sin(currStep + i * Dsplit * Math.PI/180) + scrll; 
     DL.left = Dx[i] + ClockWidth * 1.5 * Math.cos(currStep + i * Dsplit * Math.PI/180); 
    } 
    currStep -= step; 
} 

function Delay() 
{ 
    scrll = 0; 
    Dy[0] = Math.round(DY[0] += ((ymouse) - DY[0]) * speed); 
    Dx[0] = Math.round(DX[0] += ((xmouse) - DX[0]) * speed); 
    for (i = 1; i < D.length; i++) { 
     Dy[i] = Math.round(DY[i] += (Dy[i - 1] - DY[i]) * speed); 
     Dx[i] = Math.round(DX[i] += (Dx[i - 1] - DX[i]) * speed); 
    } 
    y[0] = Math.round(Y[0] += ((ymouse) - Y[0]) * speed); 
    x[0] = Math.round(X[0] += ((xmouse) - X[0]) * speed); 
    for (i = 1; i < n; i++) { 
     y[i] = Math.round(Y[i] += (y[i - 1] - Y[i]) * speed); 
     x[i] = Math.round(X[i] += (x[i - 1] - X[i]) * speed); 
    } 
    ClockAndAssign(); 
    setTimeout(Delay, 20); 
} 
Delay(); 
}()); 
</script> 


    <form id="bgms" style="text-align:right"> 
     <SELECT id="bgCol" style="background:#87cefa"; onchange="selectBgm(this);"> 
     <OPTION style="background:silver" value="" >STOP</OPTION> 
     <OPTION style="background:#87cefa" value="222.mid" selected>CLASSIC</OPTION> 
     <OPTION style="background:yellowgreen" value="333.wav">ALARM</OPTION> 
     </SELECT> 
    </form> 

<FORM NAME="sampleForm" style="text-align:center"> 
 <font id="star_clock"> 
<INPUT id="Alarmy" type="text"STYLE="color:deeppink; background-color:black; font-size:25px; border:none;" size=7 NAME="dspTime"> 
 </font> 
<br><br> 
<br><br> 
 <div> 
★ 
<INPUT type="text" name="alarmH" size=2 value="00"> 
<INPUT type="text" name="alarmM" size=2 value="00"> 
<INPUT type="button" id="setAlarm" name="setAlarm" value=" alarm ON " onClick="changeFlg();"> 
★ 
 </div> 
</FORM> 

</BODY> 
</HTML>