개발자의 끄적끄적

[javascript/jquery] 자바스크립트 사업자 번호 하이픈 예제 javascript 에서 회원가입을 구현하다보면 사이트에 따라 사업자 번호를 입력받아야 하는 경우가 있습니다. 그럴때는 아래 함수를 이용하시면 됩니다! 우선 예를들어 아래와 같은 input 태그가 있다고 가정하고,

[javascript/jquery] 카카오톡 연동 Kakao.init: Already initialized 에러 해결방법 javascript 로 카카오톡 로그인 연동을 진행하다 보면, 기본적으로 api 를 입력하여 초기화, 즉 initialize 를 하고서 사용이 가능합니다. 그러다보면 initialize 가 두번 호출되는 경우 아래 이미지와 같은 오류가 발생됩니다. Kakao.init: Already initialized 위와 같은 오류는 아래 방법으로 해결이 가능합니다! if (!Kakao.isInitialized()) { Kakao.init('KAKAO KEY'); }; initialize 하는 부분을 Kakao 객체가 초기화 되었는지 한번 체크하는 로직으로 감싸주면, 초기화 되었을때는 호출하지않고..

[javascript/jquery] javascript 한글만 허용하는 정규식 javascript 에서 특정 input 에 한글만 입력받게 설정해야 하는 경우가 있습니다! 그럴때는 해당 input에 onkeyup 이벤트를 설정하고 정규식으로 처리가 가능합니다! 우선 예를 들어 아래와 같은 input 이 있다고 가정하고 이 input 에 onkeyup 이벤트로 정규식을 처리할 함수를 호출합니다. 그리고 정규식 함수는 아래와 같이 구성하면 됩니다! function chk_han(id) { var regexp = /[a-z0-9]|[ \[\]{}()?|`~!@#$%^&*-_+=,.;:\"'\\]/g; var value = $("#"+id).val(); if (regexp.test(value)) { $("#"+..

[javascript/jquery] javascript date calculate example / 자바스크립트 몇일 뒤 날짜 계산 예제 javascript 에서 y-m-d 형식의 특정 날짜를 받아서 몇일 뒤의 날짜는 계산해야 하는 경우가 있습니다. 그럴때는 아래와 같이 date 객체를 이용하시면 됩니다! 우선 예를들어, var dateString = "2022-01-01"; 위와같이 dateString 에 2022-01-01 이라는 날짜가 있다고 가정하고, 이날짜의 14일 뒤 날짜를 계산하고 싶으면 아래와 같이 setDate 를 이용해 변경해줍니다. var result1 = new Date(dateString); result1.setDate(result1.getDate() + 14); 그리고 이렇게 변..

[javascript/jquery] 자바스크립트 우클릭 방지 예제 자바스크립트에서 특정페이지에서 혹은 사이트 전체에서 우클릭을 막아야 하는 경우가 있습니다! 그럴때는 간단하게 공통파일 혹은 해당페이지 파일 상단 or 하단에 아래 스크립트를 추가하시면 간단하게 해결됩니다! 참고들 하세요!

[javascript/jquery] jquery datepicker select event example/ jquery datepicker 날짜 선택 이벤트 예제 jquery datepicker 를 이용하다보면 div 같은 영역에 datepicker 를 구현했을때 날짜를 선택한 이벤트를 수신해야 하는 경우가 있습니다. 그럴때는 아래와 같이 onSelect 이벤트를 이용하시면 됩니다! 예를들어 class 가 datepicker 인 div 가 있다고 가정하고, 위 div 안에 datepicker 를 구현하고 싶으면 아래와 같이 스크립트를 선언하시면 됩니다. $('.datepicker').datepicker({ onSelect: function(dateString) { console.log(dateString..

[javascript/jquery] slick slide refresh example / slick 슬라이드 새로고침 example jquery 로 슬라이드를 표현하기 위해 slick 라이브러리를 사용하는 경우가 있습니다. 그중에서 슬라이드 안의 내용을 추가하고 재 설정을 해야 하는 경우가 있는데요. 그럴때는 아래 나온 내용처럼 refresh 해주면 정상반영 됩니다! $('#div_slider').slick('refresh'); 참고들 하세요!

[javascript/jquery] 자바스크립트 차트 비교 설명 사이트 [링크] javascript 로 차트를 구현하려고 하다보면 여러가지 라이브러리들이 있어서 어떤걸 써야하나, 혹은 어떤 라이브러리들이 있나를 검색하게 마련입니다! 각각 라이브러리들이 약간씩 다르기때문에 구현하고자 하는 방향에 맞는걸 선택하게 되는데요! 그럴때 참고하면 도움이 될만한 사이트가 있어서 공유하고자 합니다! 아래 링크 들어가시면 19가지 차트 종류와 간략한 설명, 특징등을 볼수 있어서, 많은 도움이 되실듯 합니다! 참고들 하세요! 19가지 차트 비교 설명 사이트 : https://wikidocs.net/151141 009. 차트 생성을 위한 19 가지 온라인 도구 및 오픈소스 차트 사이트 모음 오늘날 세계에서 사람들은 분산 된..