개발자의 끄적끄적

[javascript/jquery] jquery object to html example jquery 나 javascript 로 특정 엘리먼트를 가져오면 object 형태로 가져오게 됩니다. 그걸 다시 html 형태로 특정영역에 append 와 같이 밀어넣고 싶을때는 outerHTML 을 이용하시면 됩니다. 예를들어 아래와 같이 aaa 라는 아이디를 가지는 div 태그가 있다고 가정하고, test 위 엘리먼트를 아래와 같이 ele 라는 변수에 담고 var ele = $('#aaa'); 이것을 다시 html 형태로 값을 확인하고 싶으면 아래와 같이 outerHTML의 값을 출력하시면 됩니다. console.log(ele.get(0).outerHTML); 참고들 하세요!

[javascript/jquery] 자바스크립트 textarea 마우스 클릭위치 특정문구 추가하는 방법 javascript 에서 input 이나 textarea 와 같은 입력필드를 다루다 보면 특정경우에는 마우스 클릭한 자리에 특정 문구를 대입하는 기능을 구현하고 싶은 경우가 있습니다. 그럴때는 아래 함수를 활용하시면 됩니다. function setTextToPos(str) { var textarea = document.getElementById("textarea"); var curStart = textarea.selectionStart; let x = $("#textarea").val(); $("#textarea").val(x.slice(0, curStart) + str + x.slice(curStar..

[javascript/jquery] jquery datatable Cannot read properties of undefined (reading 'style') 에러 해결 방법 jquery datatable 라이브러리를 사용하다 보면 여러가지 에러들이 발생하곤 합니다. 그중에서 아래와 같이 style 관련 에러가 나는 경우가 있는데요. 딱히 오류원인을 찾기 힘듭니다 ㅠㅠ Cannot read properties of undefined (reading 'style') 만약 위와 같은 오류가 발생한다면 고민하지마시고, 테이블에 잡아놓은 td 수와 불러오는 데이터 수가 맞지 않아서 나는 에러일 경우니 바로 스크립트와 html 을 확인해보시면 되실겁니다! 참고들 하세요!

[javascript/jquery] jquery color picker plugin / jquery 색상 선택 플러그인 웹사이트를 개발하다보면 jquery 플러그인을 활용하는것은 기본적인 사항이 된듯 합니다. 그중에서 색상을 선택하도록 하는 color picker 를 사용하는 경우에 어떤걸 사용해야 하는지 검색을 해야하는데요 그럴때 여러가지 color picker plugin 이 다양하게 나열되어 있는 사이트를 찾아서 공유하려고 합니다. 아래 링크 들어가보시면 여러가지 플러그인들 중 원하시는것을 데모로 체험하고 다운받아서 적용하시면 됩니다! 적용방법도 그리 어렵지 않으니 금방 적용하실 겁니다! 참고들 하세요! jquery color picker plugin list : https://www.jquerys..

[javascript/jquery] jquery flip book plugin / jquery 책넘김 효과 라이브러리 [링크] javascript 를 사용하다보면 jquery 플러그인을 잘 이용해야 하는 경우가 있습니다. 그중에서 pdf 를 책넘김과 같은 효과를 주어야 하는경우가 있는데요, 그럴때는 flip-book 플러그인이 있어서 공유하려고 합니다. 책넘김과 같은 효과 밑 책 이울이기도 되는 플러그인이라 잘 활용하면 많은 도움이 되실듯 합니다! 아래 링크 들어가서 확인해보시면 될듯 합니다. 참고들 하세요! jquery flip book plugin : https://github.com/iberezansky/flip-book-jquery GitHub - iberezansky/flip-book-jquer..

[javascript/jquery] 자바스크립트 숫자와 하이픈만 허용하는 정규식 javascript 에서 정규식을 사용하다보면 전화번호와 같은 입력란에 숫자와 하이픈만 허용해야하는 경우가 있습니다. 그럴때는 아래 정규식을 이용하시면 됩니다! /[^0123456789-]/g 예를들어 val 라는 값을 전달받아서 해당 값에 숫자와 하이픈을 제외한 다른 문자가 들어있는지 확인하고 싶으면 아래와 같이 정규식을 사용하시면 됩니다! if(/[^0123456789-]/g.test(val)){ // 숫자와 하이픈이 아닌 기타 문자가 들어있는 경우 } 참고들 하세요!

[javascript/jquery] jquery 요소에 설정된 이벤트 확인하는 방법 jquery 에서 특정 요소에 이벤트가 설정되어 있는지 확인을 해야 하는 경우가 있습니다. 그럴때는 아래와 같이 확인이 가능합니다. var event = $._data(element, 'events'); 예를들어 아래와 같이 id_btn 이라는 아이디를 가지는 버튼이 있다고 가정하고, 테스트 버튼입니다. 위 버튼에 설정되어 있는 이벤트를 확인하고 싶으면 아래와 같이 jquery 를 사용하시면 됩니다! var event = $._data($("#id_btn")[0], 'events'); 참고들 하세요!

[javascript/jquery] javascript includes not working in explorer / 자바스크립트 문자열 포함여부 확인 방법 javascript 에서 특정 문자열에 찾는 문자가 들어있는지 확인해야 하는 경우가 있습니다. 그럴때는 includes 를 많이 사용합니다. 예를들어 아래와 같이 test123 이라는 문자열이 들어있는 변수 str 이 있다고 가정하고, var str = "test123"; 위 문자열에 123이라는 문자열이 포함되는지 확인하고 싶으면 아래와 같이 includes 를 사용합니다. if( str.includes('123') ) { console.log("exist"); } 하지만, includes 함수는 internet explorer 에서 오류가 나는 ..