> 웹 프론트엔드 > JS 튜토리얼 > JavaScript를 통해 같은 날 시간 비교

JavaScript를 통해 같은 날 시간 비교

亚连
풀어 주다: 2018-06-06 15:28:55
원래의
2195명이 탐색했습니다.

프로젝트 개발 중에 같은 날의 시간 비교를 자주 접하게 되는데, 아래에서는 같은 날의 시간 크기를 비교할 수 있는 JavaScript 예제 코드를 가져왔습니다. 필요하신 분들은 참고하시면 됩니다

프로젝트 개발 과정에서 가끔 일반적으로 시간 선택은 플러그인을 통해 이루어지지만 고객이 수동 입력을 요구하는 상황을 배제할 수는 없습니다.

그럼 고객의 요청에 따라 수동으로 시간을 입력하고 시간 크기를 비교해야 하는 경우 어떻게 구현해야 할까요? 다음은 제가 구현한 방법의 단계를 간략하게 소개합니다.

1. 먼저 사용자가 입력한 내용을 확인합니다.

2. 두 가지의 크기를 비교합니다. times(시간을 비교하는 세 가지 방법을 구성했습니다. 자세한 내용은 다음 코드를 참조하세요.)

4. 결과를 반환합니다.

다음은 참조용 샘플 코드입니다.

1. 사용자가 입력한 모든 콜론을 반각 콜론으로 바꾸어 후속 작업을 용이하게 합니다.

var bagin = $('.input_three').val().replace(/:/g,':');//将全角冒号替换为半角冒号,替换的目的是为了通过半角冒号分割字符
      var end = $('.input_four').val().replace(/:/g,':');
//     替换字符串中的某个字符:.replace(':',':'):只替换字符串中的第一个全角冒号;.replace(/:/g,':'):替换字符串中的所有的全角冒号
//将时间以冒号分割:以下比较时间大小的方法中会用到
var bagin_ = bagin.split(':');
var end_ = end.split(':');
로그인 후 복사

2. 시간 형식이 올바른지 여부:

//      正则验证时间格式,正确的时间范围(通过返回时间戳格式,否则返回null)
//     [0-9]在范围内取其一;?是取之前字符的0个或者1个;也可以解释为非贪婪模式;|或者
      var bagin_r = bagin.match(/^([0-1]?[0-9]|2[0-3])(:|:)([0-5][0-9])(:|:)([0-5][0-9])$/);
      var end_r = end.match(/^([0-1]?[0-9]|2[0-3])(:|:)([0-5][0-9])(:|:)([0-5][0-9])$/);
if(bagin_r==null){
  alert("请输入正确的营业时间,00:00:00-23:59:59");
  return false;
}

if(end_r==null){
  alert("请输入正确的截止时间,00:00:00-23:59:59");
  return false;
}
로그인 후 복사

3. 시간 크기 비교:

방법 1: 타임스탬프를 통해 시간 크기 비교(크기 비교를 수행하려면 타임스탬프 형식으로 변환해야 함)

if(bagin_r[1]>end_r[1]||bagin_r[1]==end_r[1]&&bagin_r[3]>end_r[3]||bagin_r[1]==end_r[1]&&bagin_r[3]==end_r[3]&&bagin_r[5]>=end_r[5]){
//         alert("开始时间不能大于等于结束时间");
//         return false;
//       }
로그인 후 복사

방법 2: 시간, 분 및 판단을 위한 입력 시간의 초

if(bagin_[0]>end_[0]||bagin_[0]==end_[0]&&bagin_[1]>end_[1]||bagin_[0]==end_[0]&&bagin_[1]==end_[1]&&bagin_[2]>=end_[2]){
//       alert("开始时间不能大于等于结束时间");
//         return false;
//     }
로그인 후 복사

방법 3: 총 초 수를 계산하여 시간을 비교합니다

var bagin_time = bagin_[0]*3600 + bagin_[1]*60 + bagin_[2];
      var end_time = end_[0]*3600 + end_[1]*60 + end_[2];
      if(bagin_time >= end_time){
        alert("开始时间不能大于等于结束时间");
          return false;
      }
//       
        else{
         alert("提交成功");
        }
로그인 후 복사

위 내용은 제가 모두를 위해 정리한 내용입니다. 앞으로 모든 분들께 도움이 되길 바랍니다.

관련 기사:

Vue에서 v-for를 사용하여 src 속성에 값을 할당하는 방법 구현(상세 튜토리얼)

vue에서 v-for를 사용하여 로컬 로드 방법 구현 정적 이미지(자세한 튜토리얼)

vue에서 v-for를 사용할 때 빨간색 및 경고 문제를 해결하는 방법(자세한 튜토리얼)

위 내용은 JavaScript를 통해 같은 날 시간 비교의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
js
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
최신 이슈
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿