728x90 반응형 자바스크립트11 [jQuery] 전화번호 형식 유효성 검사하기: 정규 표현식 활용 방법 사용자로부터 전화번호를 입력받았을 때, 그 번호가 올바른 번호인지 체크한 후 저장할 필요가 있습니다.오늘은 정규식을 활용하여 사용자로부터 입력받은 휴대폰 번호가 올바른 형식으로 입력된 것인지 판단하고,올바른 형식의 번호가 아니라면 경고창을 띄우고,올바른 형식의 번호라면 하이픈('-')을 입력하지 않은 번호는 하이픈을 입력한 형식으로 변환시켜 주는 작업까지 해보겠습니다. 전화번호 입력 박스와 jQuery문 작성 코드가 간단하기 때문에 한 번에 적어보도록 하겠습니다. 전화번호 입력 : 전화번호를 입력받을 input 태그의 text를 만들어 줍니다.id는 pcs로 지정해 주겠습니다. 다음 jQuery문을 작성합니다.id가 pcs인 태그의 포커스가 해제되었을 때 (blur) pcs에 입.. 2023. 9. 27. [javascript] "변경사항이 저장되지 않을 수 있습니다" 경고창 안나오게 하기 (onbeforeunload) 사이트에서 무언가 작업을 하거나, 작성을 하다가 페이지를 벗어나려 할 때,"페이지를 벗어나시겠습니까? 변경사항이 저장되지 않을 수 있습니다"라는 경고창을 보신 분들 꽤 많을 것입니다. 이 경고창이 필요할 때 제때 잘 나와주면 실수로 페이지 벗어나는 것도 방지되고 좋지만,메인페이지나, 정보를 수정하고 저장버튼을 눌렀을 때 저런 메시지가 나온다면 헷갈릴 수 있겠죠.내가 수정한 정보들이 저장되지 않는다는 뜻처럼 보이니까요. 이럴 때 onbeforeunload 이벤트를 사용하여 메시지를 나오지 않게 처리한다거나,혹은 해당 메시지를 출력하게 설정할 수 있습니다. onbeforeunload 이벤트? onbeforeunload 이벤트는 보통 페이지를 벗어날 때 발생하는 이벤트입니다.예를 들어 새로고침.. 2023. 4. 21. [jQuery] 클릭하지 않고 클릭 이벤트 발생 시키는 방법 웹페이지를 작성하다 보면, 하나의 버튼을 클릭했을 때 다른 버튼도 함께 동작하면 좋겠다 싶은 때가 있습니다.혹은, 순차적으로 이벤트가 발생해야 될 때가 있습니다.이럴 때마다 이미 작성해 두었던 이벤트를 다시 코딩해서 적는 건 너무 비효율 적입니다.그때 사용하면 좋은 메서드인 trigger에 대해서 알아보도록 하겠습니다. trigger 이벤트란? . trigger 이벤트는 click와 같은 javaScript 이벤트 유형을 포함하는 문자열입니다.트리거 이벤트는 트리거 이벤트 작동을 선언하기 전에 앞에서 이벤트 핸들러가 정의되어 있어야 합니다. 예를 들어 클릭 이벤트를 트리거를 사용하여 동작시키고 싶다면,클릭이벤트에 관한 코드를 먼저 작성해 주어야 합니다.코드는 순차적으로 실행되니 트리거 이벤트 위에.. 2023. 4. 19. [jQuery] 정규식을 활용한 이메일과 비밀번호 유효성 검사 소개 이메일과 비밀번호를 입력하는 웹페이지가 있다는 가정하에 양식을 제출하기 전에 jQuery를 사용하여 사용자 입력의 유효성을 검사한다고 가정해 보겠습니다. 특히 사용자가 특정 기준을 충족하는 유효한 이메일 주소와 암호를 입력했는지 확인하려고 합니다. 이를 위해 양식에서 제출 이벤트를 수신하는 jQuery 함수를 작성한 다음 이메일 및 비밀번호 입력 필드의 값을 확인합니다.필드가 비어 있거나 지정된 기준을 충족하지 않는 경우 함수는 오류 메시지를 표시하고 양식이 제출되지 않도록 합니다. 코드 $(document).ready(function() { // 양식에서 제출 이벤트 수신 $('form').submit(function(event) { // 이메일 및 비밀번호 입력 필드의 값 가져오기.. 2023. 3. 3. 이전 1 2 3 다음 728x90 반응형
