jQuery7 [jQuery]jQuery 정규표현식 이용해서 키보드 입력값 제한 jQuery 정규표현식 이용해서 키보드 입력값 제한 사용자가 입력한 값을 체크해서 알림창을 띄우거나 할 때 jQuery의 keyup()을 사용하면 됨 keyup 이벤트는 키보드의 키를 눌렀다 뗄 때 이벤트를 발생 시킴해당 이벤트는 포커스를 가질 수 있는 요소에만 발생 시킬 수 있음(ex : input)대부분의 form 요소들에서 사용가능하다고 함 ex) 사용자가 입력한 값이 한글이 아닌 값일 경우를 체크해서 경고창을 띄우는 코드 예시 // 정규표현식 -> 한글만 입력 체크 function check_input() { $("#item").keyup(function() { // 입력값에 숫자, 영문, 특수문자가 올 경우 경고창 표시 후 ""으로 치환 var regexp = /[a-z0-9.. 💻 it/development 2026. 1. 11. [JavaScript] 자식 팝업창에서 부모창의 함수 호출(javascript 위주) 부모창에서 자식창을 아래처럼 팝업으로 열었음(html 코드는 생략)parent.html//버튼 클릭 시 child라는 팝업 호출$("#btn").on("click", function() { //팝업 호출(openPopUp()이라는 공통함수에서는 팝업 호출한다고 가정) const popup = openPopUp("/child", 1100, 700, "child"); }); //자식 팝업에서 호출하는 함수(자식창에서 넘어온 사업자번호, 고객명을 부모의 필드에 적용) function chooseClient(clientBizNo, clientNm) { $("#clientBizNo").val(clientBizNo); $("#projClientNm").va.. 💻 it/development 2025. 11. 19. [jQuery] 전체 체크박스 체크 테이블의 th의 체크박스 선택 시 tbody의 td의 checkbox를 전체 체크하는 간단한 예제다. 번호 성명 아이디 function fn_chkAll(obj){ if($(obj).is(':checked')){ $('#targetBody').find('input:checkbox[.. 💻 it/development 2025. 11. 15. [JavaScript] selectbox 동적 표시 상위 선택값에 따라 하위 선택값이 다르게 표시되어야 되는 경우가 있다.예를 들면 아래와 같은 상황이다.광역지자체에 따라 그 하위 지자체 목록이 표시1번 selectbox 선택 데이터를 조건으로 서버에서 데이터를 조회 후 2번 selectbox를 동적으로 그려야 한다.상위 selectbox에 onchagne() 이벤트를 걸어서 데이터 변경이 감지될 때마다 서버에서 데이터를 가져와서 하위 selectbox의 option값을 그린다. 관리 광역지자체 관리 기초지자체 전체 function fn_get_LocalGovInstCode(){ //광역지자.. 💻 it/development 2025. 11. 15. [jQuery] 공통으로 선택자 처리 거창할 건 없고 매개변수로 넘긴 문자열 앞에 "#"를 붙여서 아이디 선택자로 만들어서 처리한다.소스를 보면 바로 이해가 된다.html상단 탭에 클릭 이벤트를 줬고 2개의 매개변수를 넘긴다. 전체메뉴 인기메뉴 특별메뉴 script구분자를 받아서 서버로 넘겨서 구분자에 해당되는 데이터를 조회, tartget id명을 받아서 "#"를 붙여 선택자로 처리, 이러면 function 여러개 만들 필요 없이 저 function 하나로 처리가 가능하다.(화면에서 하나의 테이블만 바라보고 테이블에 구분자 컬럼이 있음)누구나 알고 있을 수 있지만 그래도 메모한다.function getMenuList(gubun, target) { $.aja.. 💻 it/development 2025. 11. 12. [JavaScript] 다중 select 예시(feat. 지역코드) 개발컨셉은 아래와 같다.개발 컨셉셀렉트박스 2개 존재- 광역지자체- 기초지자체페이지 로드 후에는 광역지자체 데이터만 있는 상태고 기초지자체 데이터는 없는 상태광역지자체 선택 시 해당 코드에 해당되는 기초지자체 데이터가 기초지자체 selectbox에 세팅됨광역지자체에서 다시 선택을 누르면 기초지자체는 다시 데이터 초기화됨지자체 선택 후 검색 이벤트 발생 시 선택한 광역지자체, 기초지자체코드가 selected됨script$(document).ready(function () { //광역지자체코드 세팅 cf_L_inst_option('serachInstL'); //검색한 광역 지자체코드(jsp라서 jstl 문법 사용) var serachUpperInstL = ''; if (serachUpperInstL) { .. 💻 it/development 2025. 11. 12. [jQuery] 체크 이벤트 강제 발생 시키기 화면에 체크박스가 2개 있고, 체크박스의 change 이벤트를 감지하여 두 체크박스가 모두 체크되었을 때만 버튼을 활성화시키는 기능이 있다.그런데, 사용자가 직접 체크박스를 체크했을 때는 이벤트가 잘 감지되었지만, 함수 호출로 동적으로 체크박스를 체크한 경우는 감지되지 않는 문제가 있었다.이유는 기본적으로 체크박스를 동적으로 조작하면 이벤트가 발생하지 않기 때문에 그렇다.그래서 trigger.('이벤트명')으로 이벤트를 강제로 발생시켜 해결 했다.수정 전function check(checkId, target) { document.getElementById(target).classList.add('d-none'); $("#" + checkId).prop('checked', true); .. 💻 it/development 2025. 8. 31. 이전 1 다음