분류 전체보기126 [JavaScript] window.print() 지정 영역, 원하는 영역 출력하기 자바스크립트에서는 프린터로 출력하는 함수 window.print()를 제공한다. 단, 이 함수는 웹페이지 전체 영역이 출력되는 함수이기때문에 필요한 영역만 지정해야할 필요가 있다. 원하는 영역 프린트를 제어하기 위한 이벤트 핸들러는 두 종류가 있다. window.onbeforeprint 와 window.onafterprint 영역을 지정하여 출력하기 이벤트 핸들러를 추가하여 영역을 지정해보자. window.onbeforeprint 와 window.onafterprint에 콜백함수를 지정한다. window.onbeforeprint 프린트 출력 이전 이벤트 발생 미리보기 시에 콜백함수 실행 window.onafterprint 프린트 출력 이후 이벤트 발생 미리보기 취소 또는 프린트 완료 후에 실행 아래는 간.. 2022. 1. 25. [MySQL, MariaDB] csv 파일을 DB 테이블로 Import 엑셀로 정리된 파일을 mariadb(mysql)에 한번에 insert 하기위한 방법을 정리해보려고 한다. 간단하게 순서를 적어보자면, 1. 엑셀파일의 데이터 정리 - insert 될 데이터만 남기고 열 이름은 삭제한다. 2. 엑셀파일을 CSV 파일로 저장 - 엑셀파일에서 다른이름저장(다른형식)을 클릭한 후 확장자를 CSV로 선택하여 저장한다. ex) test_insert.csv 3. mariadb에 접속한다. (이 글에서는 DBeaver DBMS를 사용함) 4. 한글 깨짐을 해결하기 위해 위에서 저장한 CSV파일을 메모장으로 연다. - 메모장으로 연 후, 다른이름으로 저장을 눌러 인코딩을 UTF-8로 맞춰준다. (아래 사진 참고) 5. DBeaver에 다음 명령어를 입력한다. - 단, 테이블의 필드와 c.. 2022. 1. 24. [JavaScript] 버튼 클릭하여 주소 복사하기 서울특별시 --구 --로 00빌딩 주소복사 2022. 1. 18. [JavaScript] <li> 드래그 앤 드롭, 위 아래로 이동시키기 형태의 요소들을 드래그 앤 드롭으로 위치를 변경하고자 한다. 참고로 태그 외에 다른 것들도 가능하다. 가장 간단한 방법은 제이쿼리 라이브러리 sortable 를 추가해서 쓰는 것이다. 위 방법으로 아주 손쉽게 구현이 가능하다. 하지만 이번에는 자바스크립트를 이용해서 구현하는 연습을 하려고 한다. HTML5 가 제공해주는 드래그 앤 드롭(drag and drop) API를 이용해보자. 0. 드래그 앤 드롭 이벤트 아래 표 내용과 같이 다양한 이벤트가 있는데, dragstart, dragover, dragend를 사용할 예정. dragstart 사용자가 객체(object)를 드래그하려고 시작할 때 발생함. dragenter 마우스가 대상 객체의 위로 처음 진입할 때 발생함. dragover 드래그하면서 마우.. 2021. 12. 21. [CKEditor] CKEditor4 사용하기 1. CKEditor 다운로드CKEditor4 DownloadCKEditor4 Custome Download각자 필요한 상황에 맞게 plugins, skin, 언어 추가 가능 2. 다운로드 후 JS 파일 추가압축 해제 후 resource/static 내 폴더로 이동 + 스킨 추가할 경우에 아래 사진 참고해서 디렉토리 내에 추가 3. JS Import 4. CKEditor 세팅스크립트 안에 아래 코드를 추가한다.주의할 점은 아래 코드에서 id 명을 넣는 곳에 id라고 해서 "#"을 붙이면 안 됨.아래 예시는 이미지 업로드 기능은 제거한 상황이라서, 각자 상황에 맞게 커스텀해서 사용해야 함.CKEDITOR.replace( 'id' , { width:'100%', height:'200px', .. 2021. 12. 17. [JavaScript] 정규표현식으로 html 태그 제거하는 방법, 태그 제거 정규식 문제상황 글자 수를 체크해야 되는 상황인데, CKEditor로 넘기다보니 글자 수 안에 HTML태그들도 함께 들어가게 되었다. 그래서 글자+공백수보다 더 초과해서 글자수로 매겨지는 문제상황이 생겼다. 정규표현식을 이용해서 태그를 제거한 후에 글자수를 체크하여 문제 해결! 아래 정규표현식은 html 태그를 제거하기 위한 식으로 모든 태그를 제거한다. const extractTextPattern = /(]+)>)/gi; 이걸 활용하여 아래와 같이 적용해보았다. //html tag 제거 정규식 var extractTxt = $("#txt-contents").val().replace(/(]+)>)/gi, ''); //글자수 체크 if( extractTxt.length > 500 ) { alert("내용 길이가 .. 2021. 12. 16. 이전 1 ··· 9 10 11 12 13 14 15 ··· 21 다음
