본문 바로가기

웹프로그래밍/Javascript

(26)
window.open 새로운 윈도우 창에 post 로 보내기 오늘은 요구사항으로 새 윈도우 창에 post 로 보내달라는 게 있어서 포스팅에 추가해봅니다. Vanilla로 짜도되고 jQuery를 쓰셔도 되는데, 두가지를 모두 소개해볼게요. Vanilla var form = document.createElement('form'); form.setAttribute('target', '_blank'); form.setAttribute('action', '__TARGET_URL__'); form.setAttribute('method', 'post'); var input = document.createElement('input'); input.setAttribute('type', 'hidden'); input.setAttribute('value', '__VALUE__HERE..
validate JSON (JSON 여부 검사) const isJson = (str: string) => { try { const json = JSON.parse(str); return json && typeof json === 'object'; } catch (e) { return false; } };
get only text by clipboard Copy & Paste 시에 텍스트만 가져오도록 처리 onpaste 이벤트에 걸면된다. const getTextByPasteClipboard = (e) => { e.preventDefault(); let text; const clp = (e.originalEvent || e).clipboardData; if (clp === undefined || clp === null) { // eslint-disable-next-line @typescript-eslint/ban-ts-ignore // @ts-ignore text = window.clipboardData.getData('text') || ''; if (text !== '') { text = text.replace(/]*>/g, ''); if (windo..
get Image width and height const getImageSize = (file: File, callback: (width: number, height: number) => void) => { const reader = new FileReader(); reader.readAsDataURL(file); reader.onload = (e) => { const image = new Image(); image.src = e.target.result as string; image.onload = function () { // eslint-disable-next-line @typescript-eslint/ban-ts-ignore // @ts-ignore callback(this.width, this.height); }; }; }
moment.js (날짜관련 작업을 위한 자바스크립트 라이브러리) 들어가며 calendar 프로젝트를 진행하면서 날짜 관련정보를 다루었다(Date 객체). 프로젝트 중에 날짜 관련 data를 쉽게 다룰수 있는 라이브러리를 발견하여 이에 대해서 간단히 정리해보고자 한다. Moment.JS 는 날짜(Date)형식의 데이터의 파싱, 검증, 조작 그리고 화면에 출력하는 작업을 위해 만들어진 아주 유용한 라이브러리이다. 프로젝트를 통해 느낀 Date object의 불편함 & Moment.JS의 편리함 Date object와 관련된 method를 사용하면서 불편한점이 많았다. 한가지 예를 들면 ISO 포맷형태의 날짜data(ex. 2017-01-25)를 얻기 위해서, 시간이 까지 포함된 ISOString형태(ex. 2017-01-25T12:25:00.000z)에서 T를 기준으로 ..
[Javascript] 페이지를 떠날 때 경고창 띄우기 다음과 같이 페이지를 벗어나기 전에, ‘수정사항이 있으니 다시 한번 확인해보세요’라는 메시지를 구현하는 방법에 대한 정리입니다. Javascript의 window.onBeforeUnload Event를 이용한 기능입니다. 실행시점 window.onBeforeUnload Event는 Window개체가 Unload되기 전에 실행됩니다. 정확하게 다음과 같은 시점이 있을 수 있습니다. 다만 IE 7, 8에서는 버그로 인해 다르게 동작하는 경우도 있으므로 참고가 필요합니다. 창이나 탭을 닫을 때 새로고침, 앞, 뒤로 이동버튼 클릭 시 location.href 변경 Form Submit 발생 시 A Tag 클릭 시 HREF에 URL을 지정한 경우: 발생 HREF에 #을 지정한 경우: 발생 안함 HREF에 java..
javascript ios app open self.location / window. not working ios app 을 웹 어플리케이션에서 킬때... 사파리에서는 안먹히는 것 해결
jquery ui dialog close button missing jquery-ui 의 dialog close 버튼이 안보일때 bootstrap.min.js 와 스크립트 충돌로 인한것으로 해당 스크립트를 우선순위를 바꾸거나 제외하면 정상적으로 보인다.