我们有时候会遇到这样的问题,给定一个时间或时间段,判断该时间或时间段是否在某个规定的时间范围内,比如公司OA系统规定在提交会议室使用申请时,会议时间不能占用母婴时间段,前端必须得进行时间段合法性校验,那么我们该如何处理呢?公司规定某会议室的母婴时段为 9:00-10:00, 12:00 - 13:30,17:00-18:00 会议申请单的时间不能占用母婴时间段。
比如上图所示 该会议申请单,所选择的时间段 12:00~13:00 很明显 占用了 母婴时间段规定的 12:00~13:30 中的一部分,所以系统必须提示,该时间段不合法,前端应该警告并中止用户的提交动作,那么具体到 JS 代码,我们该如何实现这一功能呢?参考代码如下:
if(saveDraft=='false'){ //提交 暂存时不校验 if(fdHoldPlaceId.value =='14bcfb6f8599a9ca22e99ca4a67ba773'){ //小会议室 具体到某一个会议室才校验 if(checkMatherTime(fdHoldTime.value,fdFinishTime.value)){ alert('小会议室 9:00~10:00, 12:00~13:30,17:00~18:00 为母婴时间段,请重新选择会议时间!'); return; } } }那么 函数 checkMatherTIme() 是什么呢 ,如何将 会议开始时间与会议结束时间作为参数进行校验的,参考代码如下
/*** *检查是否是母婴时段 9:00-10:00, 12:00 - 13:30,17:00-18:00 * fdHoldTime 会议开始时间 * fdFinishTime 会议结束时间 * 是母婴时段 返回 true 不是母婴时段返回 false */ function checkMatherTime(fdHoldTime,fdFinishTime){ //console.log('fdHoldTime:'+fdHoldTime+' fdFinishTime:'+fdFinishTime); //母婴段开始时间 var holdarr = new Array(); holdarr[0] = "9:00"; holdarr[1] = "12:00"; holdarr[2] = "17:00"; //母婴段结束时间 var finisharr = new Array(); finisharr[0] = "10:00"; finisharr[1] = "13:30"; finisharr[2] = "18:00"; //根据传来的会议开始与结束时间来判断是否在母婴时间段中 var result = false; //返回结果 var checkBorder = false; //是否校验边界 默认不校验 for(var i=0; i<3 ;i++){ //会议开始时间验证不验证边界值由开始时间是否是母婴结束时间决定:会议开始时间是母婴结束时间不验证边界值,其他情况必验边界值 //判断会议开始时间是否是母婴时段结束时间 if(isCheckBorder(fdHoldTime,finisharr)){ checkBorder = true; }else{ checkBorder = false; } result = time_range(holdarr[i],finisharr[i],fdHoldTime,checkBorder); //console.log(' fdHoldTime:'+fdHoldTime+' result:'+result); if(result) return true; //会议结束时间验不验边界值由结束时间是否是母婴时间段起始时间决定 : 会议结束时间是母婴开始时间不验边界值,其他情况必验边界值 //判断会议结束时间是否是母婴时段开始时间 if(isCheckBorder(fdFinishTime,holdarr)){ checkBorder = true; }else{ checkBorder = false; } result = time_range(holdarr[i],finisharr[i],fdFinishTime,checkBorder); //console.log(' fdFinishTime:'+fdFinishTime+' result:'+result); if(result) return true; } return result; }关于isCheckBorder() 函数
/** *是否需要验证边界值 * fdHoldTime 会议结束时间 比如 12:00 18:00 * holdarr 母婴开始时间数组 "9:00","12:00","17:00" * return true 边界值校验 false 边界值不校验 */ function isCheckBorder(endTime,holdarr){ for(var i=0 ; i<holdarr.length; i++){ if(endTime == holdarr[i]) return false; } return true; }关于 time_range() 函数
/** *用来判断一个时间是不是在某个时间段内 *参数: *beginTime 开始时间 *endTime 结束时间 *varTime 需要判断的时间 *falg true 边界值校验 false 边界值不校验 *返回: true/false */ function time_range(beginTime,endTime,varTime,falg){ var strb = beginTime.split (":"); if (strb.length != 2) { return false; } var stre = endTime.split (":"); if (stre.length != 2) { return false; } var strv = varTime.split (":"); if (strv.length != 2) { return false; } var b = new Date (); var e = new Date (); var v=new Date(); b.setHours(strb[0]); b.setMinutes(strb[1]); e.setHours(stre[0]); e.setMinutes(stre[1]); v.setHours(strv[0]); v.setMinutes(strv[1]); //console.log(v.getTime()- b.getTime()); //console.log(e.getTime()- v.getTime()); if(falg){//边界值校验 if((v.getTime()- b.getTime()>=0 && (e.getTime()- v.getTime())>=0)){ return true; }else { return false; } }else{ if((v.getTime()- b.getTime()>0 && (e.getTime()- v.getTime())>0)){ return true; }else { return false; } } }通过以上四段示例代码,就实现了对母婴时间段的校验,当然函数有进一步优化的空间,这里只是抛砖引玉罢了,读者可以自行编写出合适自己业务的优秀代码。