> 웹 프론트엔드 > 프런트엔드 Q&A > jquery를 사용하여 날짜 형식의 유효성을 검사하는 방법

jquery를 사용하여 날짜 형식의 유효성을 검사하는 방법

PHPz
풀어 주다: 2023-04-17 13:36:42
원래의
1474명이 탐색했습니다.

프런트 엔드 개발에서는 날짜 형식을 확인해야 하는 상황에 자주 직면합니다. jquery는 날짜 형식 확인을 쉽게 완료하는 데 도움이 되는 매우 편리하고 사용하기 쉬운 도구 라이브러리입니다. jquery를 사용하여 날짜 형식을 확인하는 방법을 소개합니다.

1. jquery 라이브러리 소개
jquery를 사용하여 날짜 형식을 확인하기 전에 먼저 jquery 라이브러리를 소개해야 합니다. 로컬 jquery 라이브러리를 소개하거나 CDN을 통해 소개할 수 있습니다.

<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
로그인 후 복사

2. 정규식을 사용하여 확인합니다. 날짜 형식
확인 날짜 형식은 정규식을 사용할 수 있습니다. jquery는 문자열에서 공백, 줄 바꿈과 같은 잘못된 문자를 제거할 수 있는 정규식 확인 메서드 $.trim()를 제공합니다. 다음 정규 표현식을 사용할 수 있습니다. $.trim(),可以去掉字符串中的空格以及换行符等无效字符。可以使用如下的正则表达式:

var reg = /^(\d{4})-(\d{2})-(\d{2})$/;
로그인 후 복사

以上正则表达式可以验证形如"2021-05-01"的日期格式,其中d表示数字,{n}表示连续出现n次,^表示匹配字符串的开头,$表示匹配字符串的结尾,()表示分组。
我们可以通过以下代码来使用正则表达式验证日期格式:

var date = $('#date').val();
if ($.trim(date).match(reg) == null) {
    alert("日期格式不正确,请重新输入");
}
로그인 후 복사

上述代码中,#date表示要验证的日期输入框,val()方法可以获取输入框中的值,$.trim()方法去掉空格和换行符等无效字符,match()

var date = $('#date').val();
if (!moment(date).isValid()) {
    alert("日期格式不正确,请重新输入");
}
로그인 후 복사
위 정규 표현식은 "2021-05-01"과 같은 날짜 형식을 확인할 수 있습니다. 여기서 d는 숫자를 나타내고 {n}는 n번 연속 발생을 의미하고, <code>^는 문자열의 시작 부분과 일치함을 의미하고, $는 문자열의 끝 부분과 일치함을 의미하며, () 그룹화를 의미합니다.

다음 코드를 사용하면 정규식을 사용하여 날짜 형식을 확인할 수 있습니다.
rrreee
위 코드에서 #date는 확인하려는 날짜 입력 상자를 나타내고, val() 메소드 입력 상자에서 값을 가져올 수 있습니다. $.trim() 메소드는 공백 및 줄 바꿈과 같은 유효하지 않은 문자를 제거합니다. 문자열을 정규식과 일치시키는 데 사용됩니다. 반환 값이 null이면 날짜 형식이 잘못되었음을 의미합니다.

3. moment.js 플러그인을 사용하여 날짜 형식을 확인하세요.

날짜 형식의 정규식 확인 외에도 moment.js 플러그인을 사용하여 날짜 형식을 확인할 수도 있습니다. 다양한 날짜 형식을 쉽게 처리할 수 있는 강력한 날짜 처리 도구입니다.

날짜 형식 코드를 확인하려면 다음과 같이 moment.js를 사용하십시오.
rrreee

위 코드에서 moment() 메소드는 입력된 날짜 문자열을 순간 객체로 변환하고 isValid() 메소드를 사용하여 날짜가 날짜 형식인지 확인합니다. 날짜가 유효하지 않으면 false를 반환합니다. 🎜🎜4. 결론🎜이 글에서는 jquery가 날짜 형식을 확인하는 두 가지 방법, 즉 정규 표현식을 사용하는 방법과 moment.js 플러그인을 사용하는 방법을 소개합니다. 어떤 방법을 사용하든 먼저 jquery 라이브러리나 moment.js 플러그인을 도입해야 합니다. 정규식 확인 방법은 더 간단하지만 특정 형식의 날짜에만 적합합니다. .js 플러그인은 더 많은 것을 처리할 수 있습니다. 날짜 형식은 많지만 코드도 많이 도입되어 페이지 성능에 일정한 영향을 미칩니다. 실제 상황에 따라 어떤 방법을 사용할지 선택할 수 있습니다. 🎜

위 내용은 jquery를 사용하여 날짜 형식의 유효성을 검사하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

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