본문 바로가기

반응형

Javascript

(6)
Ajax 통신 시 Form 데이터 만들기 Document에 Form을 그대로 사용해서 FormData 만드는 방법 실제 form을 불러와서 설정할 수 있다. let file_form = document.getElementById("file_form"); var formdata = new FormData(file_form); oAjaxReq.send(formdata); Javascript에서 Form을 구성하는 방법 let formData = new FormData(); formData.append('post_id', post_id); formData.append('comment', comment); oAjaxReq.setRequestHeader("X-CSRFToken", getCookie('csrftoken')); oAjaxReq.send(fo..
console log 남기기 브라우저 Debug 모드 사용 시 console에 log를 남길 수 있다. 방법은 console.log("남기고 싶은 메시지") 와 같이 사용하는 것이다. console.log(i);
javascript execCommand 이용하기 https://developer.mozilla.org/en-US/docs/Web/API/Document/execCommand 이미지 썸네일 삭제 Document.execCommand() - Web APIs | MDN When an HTML document has been switched to designMode, its document object exposes an execCommand method to run commands that manipulate the current editable region, such as form inputs or contentEditable elements. developer.mozilla.org 일단 위의 페이지에 들어가면 deprecated 되었다고 나온다. 하지만..
javascript Color Picker 만들기 https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/color 이미지 썸네일 삭제 - HTML: HyperText Markup Language | MDN elements of type color provide a user interface element that lets a user specify a color, either by using a visual color picker interface or by entering the color into a text field in #rrggbb hexadecimal format. developer.mozilla.org 오른쪽 정렬오른쪽 정렬왼쪽 정렬왼쪽 정렬가운데 정렬가운데 정렬 삭제삭제 1. ..
Javascript Image Size 조절 https://stackhowto.com/how-to-increase-and-decrease-image-size-using-javascript/ 이미지 썸네일 삭제 How to Increase and Decrease Image Size Using JavaScript - StackHowTo To increase and decrease image size. You can use JavaScript’s width or height property to proportionally increase or decrease the stackhowto.com 오른쪽 정렬오른쪽 정렬왼쪽 정렬왼쪽 정렬가운데 정렬가운데 정렬 삭제삭제 css를 이용하여 그림 사이즈 조절이 가능합니다. let imgTag = document.c..
Ajax Pure Javascript 를 이용한 File upload 1. File Object 숨기기 위해 별도의 form을 하나 만들고 multipart로 설정한다. Cross-Site Request Forgery (CSRF) 공격을 방지하기 위해 token도 넣어준다. {% csrf_token %} 2. createElement를 이용하여 form에 file input을 추가한다. var fileSelector = document.createElement('input'); fileSelector.setAttribute('type', 'file'); fileSelector.setAttribute('name', 'fileupload'); fileSelector.setAttribute('accept', 'image/*'); 3. function 이 클릭 되었을 때 작동되는..

반응형