jquery+bootstrap 实现简单备忘录（三）

写在前面的话

在这篇文章中，我会详细介绍这个项目的灵魂所在：备忘闹钟铃声提醒功能的实现

time_watch

程序一旦开始运行，初始化dom结构后，便会运行time_watch（时间监听函数）

//时间监听
function time_watch(){
var nowtime;
time_check();
watcher = setInterval(function(){
nowtime = new Date().getTime();
if(nowtime > timeobj.neartime){//到达预定时间
time_get();
}
},1000);
}

time_check

在运行time_watch函数时，便会执行它内部的time_check(时间检查函数)。
time_check的作用是从所有的未完成的备忘中，选取一个离现在最近的备忘

//时间检查 获取离现在最近的一个任务
function time_check(){
var key,object,state;
timeobj.neartime = new Date("2020-01-01").getTime();
for(var i=0;i<localStorage.length;i++){
key = localStorage.key(i);
/*JSON.parse将string转换为json*/
object = JSON.parse(localStorage.getItem(key));
state = object.state;
if(state){//未完成
var stime = new Date(object.time).getTime();//获取预定时间
if(stime < timeobj.neartime){//如果有更近的时间
timeobj.neartime = stime;
timeobj.nearflag = i;
timeobj.obj = object;
}
}
}
}
//时间达到预定后处理

执行完time_check函数后，获得了离现在最近的一个备忘后，程序又继续执行time_watch函数，此时开启了一个时间监听器watcher = setInterval()。time_watch每隔一秒便判断是否达到备忘提醒时间。
如果达到了，便执行time_get函数

time_get

达到提醒时间后，执行time_get函数（时间达到后处理函数）

//时间达到预定后处理
function time_get(){
alert.play();//闹钟提醒
idFlag = timeobj.nearflag;
thing_change();
time_remain();
init();
time_reset();//开启下一次事件的监听
}

首先播放闹钟铃声，并且改变备忘状态（由未完成改为已完成）。然后在页面上进行显示提醒（time_remain函数）

time_remain

//显示提醒面板
function time_remain(){
var str='<li>'+
'<div class="alert alert-warning alert-dismissible fade in" role="alert">'+
'<button type="button" class="close" data-dismiss="alert" aria-label="Close">'+
'<span aria-hidden="true">知道了</span>'+
'</button>'+
'<strong>注意!</strong>'+
'<span style="margin-left:10px">'+timeobj.obj.content+'</sp an>'+
'</div>'
'</li>';
$('#rList').append(str);
}

time_reset

//重新监听时间
function time_reset(){
clearInterval(watcher);//事件树已经变化，需要重新监听
time_watch();
}

接下来的事，又重新交还给了time_watch。它会再调用time_check函数。重新获得一个离现在最近的备忘。
然后每秒一次的去监听提醒时间，这形成了一次次的循环。
到这里，我这个项目的灵魂所在，闹钟功能的实现已经说完了。但是有两个点我需要提醒一下:
你应该发现了我的数据操作函数里都执行了init函数，为什么？因为数据操作后dom树结构已经变化，需要重新初始化dom树结构。
我的操作函数里都执行了time_reset函数，为什么？同样的道理。因为数据操作后dom树结构已经变化，也需要重新监听提醒时间。

程序地址