Javascript 当输入值等于当前时间时触发报警_Javascript_Html_Alarm

Javascript 当输入值等于当前时间时触发报警

javascript html

Javascript 当输入值等于当前时间时触发报警,javascript,html,alarm,Javascript,Html,Alarm,我想创建多个闹钟，如果在任何时候该闹钟的值（小时和分钟）等于当前时间（小时和分钟），则触发任何闹钟。我根据用户输入生成警报，用户输入他们希望触发警报的设置时间（小时和分钟），并且任何时候用户输入与当前时间匹配时，都应触发警报。这里的问题是，警报没有响。设定的时间将过去，报警器将拒绝鸣响。这是我的密码 CSS HTML 戒指！！！！！！！！！设置警报 JAVASCRIPT function startTime(alarmHour, alarmMinute) { var toda

我想创建多个闹钟，如果在任何时候该闹钟的值（小时和分钟）等于当前时间（小时和分钟），则触发任何闹钟。我根据用户输入生成警报，用户输入他们希望触发警报的设置时间（小时和分钟），并且任何时候用户输入与当前时间匹配时，都应触发警报。这里的问题是，警报没有响。设定的时间将过去，报警器将拒绝鸣响。这是我的密码

CSS

HTML




戒指！！！！！！！！！
设置警报

JAVASCRIPT

function startTime(alarmHour, alarmMinute) {
  var today = new Date();
  var currentHour = today.getHours();
  var currentMinute = today.getMinutes();
  var currentSecond = today.getSeconds();
  document.getElementById('txt').innerHTML =
  currentHour + ":" + currentMinute + ":" + currentSecond;
  var t = setTimeout(startTime, 500);

  
  if(currentHour == alarmHour && currentMinute == alarmMinute) {
  document.getElementById("ring").style.display = "block"
  }
 
};


var list = document.getElementById("list");
var alHour = document.getElementById("hour");
var alMinute = document.getElementById("minute");


function newAlarm(hour, minute){
    startTime(hour, minute)
    theAlarm = `<li><span>${hour}:</span><span>${minute}</span></li>`; 

    var position = "afterbegin";
    list.insertAdjacentHTML(position, theAlarm);
              

  }

  function addAlarm(){
   var hour = parseInt(alHour.value);
   var minute = parseInt(alMinute.value);
    if (hour, minute) {
      newAlarm(hour, minute);
      alHour.value ="";
      alMinute.value ="";
    }
  };

功能启动时间（报警小时、报警分钟）{
var today=新日期（）；
var currentHour=today.getHours（）；
var currentMinute=today.getMinutes（）；
var currentSecond=today.getSeconds（）；
document.getElementById（'txt'）.innerHTML=
currentHour+“：”+currentMinute+“：”+currentSecond；
var t=设置超时（开始时间，500）；
如果（currentHour==alarmHour&¤tMinute==alarmMinute）{
document.getElementById（“环”）.style.display=“块”
}
};
var list=document.getElementById（“列表”）；
var alHour=document.getElementById（“小时”）；
var alMinute=document.getElementById（“分钟”）；
新报警功能（小时、分钟）{
开始时间（小时、分钟）
theAlarm=`${hour}:${minute}`；
var position=“afterbegin”；
列表。插入相邻的TML（位置，报警）；
}
函数addAlarm（）{
var hour=parseInt（alHour.value）；
var minute=parseInt（alMinute.value）；
如果（小时、分钟）{
新警报（小时、分钟）；
alHour.value=“”；
alMinute.value=“”；
}
};

嗯，我不太明白你的问题，但我根据你所说的修改了代码

var报警时间；
var报警分钟；
setInterval（函数（）{
var today=新日期（）；
var currentHour=today.getHours（）；
var currentMinute=today.getMinutes（）；
var currentSecond=today.getSeconds（）；
document.getElementById（'txt'）.innerHTML=
currentHour+“：”+currentMinute+“：”+currentSecond；
如果（currentHour==alarmhour&¤tMinute==alarmminute）{
document.getElementById（“环”）.style.display=“块”；
}
}, 500)
var list=document.getElementById（“列表”）；
var alHour=document.getElementById（“小时”）；
var alMinute=document.getElementById（“分钟”）；
新报警功能（小时、分钟）{
alarmhour=小时；
alarmminute=分钟；
theAlarm=`${hour}:${minute}`；
var position=“afterbegin”；
列表。插入相邻的TML（位置，报警）；
}
函数addAlarm（）{
var hour=parseInt（alHour.value）；
var minute=parseInt（alMinute.value）；
如果（小时、分钟）{
新警报（小时、分钟）；
alHour.value=“”；
alMinute.value=“”；
}
};
#环{
显示：无；
}
李{
列表样式类型：无；
边框：纯灰1px；
填充：10px；
保证金：3倍；
}



戒指！！！！！！！！！
设置警报


这里有什么问题？嗯，伙计，不要使用setTimeout函数，试试使用setInterval！这对你会有很大帮助lot@robinsax，代码不起作用。警报没有触发。设定的时间会过去，什么也不会发生。
<body onload="startTime()">
<div id="txt"></div> <br>
<h1 id="ring">Ring!!!!!!!!!</h1>

<input type="text" placeholder="hour" id="hour">
<input type="text" placeholder="minute" id="minute">
<button onclick="addAlarm()">Set alarm</button>


<ul id="list">
<!--Alarm clocks goes here-->
</ul>

</body>

function startTime(alarmHour, alarmMinute) {
  var today = new Date();
  var currentHour = today.getHours();
  var currentMinute = today.getMinutes();
  var currentSecond = today.getSeconds();
  document.getElementById('txt').innerHTML =
  currentHour + ":" + currentMinute + ":" + currentSecond;
  var t = setTimeout(startTime, 500);

  
  if(currentHour == alarmHour && currentMinute == alarmMinute) {
  document.getElementById("ring").style.display = "block"
  }
 
};


var list = document.getElementById("list");
var alHour = document.getElementById("hour");
var alMinute = document.getElementById("minute");


function newAlarm(hour, minute){
    startTime(hour, minute)
    theAlarm = `<li><span>${hour}:</span><span>${minute}</span></li>`; 

    var position = "afterbegin";
    list.insertAdjacentHTML(position, theAlarm);
              

  }

  function addAlarm(){
   var hour = parseInt(alHour.value);
   var minute = parseInt(alMinute.value);
    if (hour, minute) {
      newAlarm(hour, minute);
      alHour.value ="";
      alMinute.value ="";
    }
  };