ioerror

개요 정규식을 이용한 이메일 주소 유효성 확인을 위한 Javascript의 기본 기능은 이메일 유효성 확인에서 소개를 했는데, jQuery의 플러그인을 만들어 보자. 먼저 이메일 주소를 입력창에 입력했을 때 바로 확인할 때와 폼 전송할 때 확인할 때 같이 사용하는 플러그인이다. 이메일 주소 확인 정규식 코드 이메일 주소를 입력하고 포커스를 이동하면 정규식을 통해 유효성 확인하고 오류이면 메시지를 출력한다. 정규식 패턴의 상세 내용은 "[JS] 이메일 주소 유효성 확인하기(feat. 정규식)"에서 확인 가능하다. $('#email').change(function() { let email = $(this).val(); let pattern_email = /^[\w-]+(\.[\w-]+)*@([\w-]+\.)..

상황 "티스토리에 내용 목차 만들기"에서 만든 목차(TOC) 스크립트에 스크롤 이동으로 목차에 현재 위치를 표시하는 기능을 추가하고 싶어 졌다. scrollspy를 간단히 구현해서 적용하면 될 듯해서 스크립트와 스킨의 CSS 도 수정했다. 그리고 코드를 삽입했을 때 어떤 코드인지 코드 블록에 표시하는 것이 좋을 듯해서 스크립트를 추가했다. 스크롤 스파이 (scrollspy) 스크롤 위치를 감지해서 특정 기능을 수행하는 기능으로 bootstrap의 scrollspy를 사용하려 했으나 이 스킨에 부트스트랩을 적용하면 배보다 배꼽이 커질 거 같다. 일단 $(window).scroll 이벤트로 스크롤바의 위치를 확인하고 chapter.js 에서 생성된 태그의 위치를 확인, name에 해당하는 목차의 링크를 찾아..

들어가며. jQuery 처음 생겨났을 때 DOM 선택자가 CSS의 선택 방식과 동일하여 많은 인기를 얻었었고 그만큼 DOM 노드에 쉽게 접근 할수 있다 선택자 규약(?)이 많은 편이지만 외울 필요는 없을 거 같다. 많은 것들 중에 자주 사용하는 것은 자동적으로 외워지고, 이런 게 필요한데 하고 찾아보면 있기 때문이다. 그리고 선택자, 필터 등을 조합하면 다 찾을 수 있다. 물론 그렇게 안되도록 간결한 html 문서를 작성해야 하겠지만 말이다. 공식 문서에 잘 되어 있지만, 지금까지 아무 생각 없이 사용하던 것을 정리하는 차원에서 기록 한다. jQuery API Documentation - Selectors 1. 기본 선택자 jQuery 의 DOM 노드(요소, 엘리먼트, Element)를 선택하는 것은 스..