2022-11-25 0. 사용 라이브러리 https://clipboardjs.com/ clipboard.js A modern approach to copy text to clipboard. No Flash. No frameworks. Just 3kb gzipped clipboardjs.com 우리가 사용할 라이브러리는 clipboard.js 이며 이를 cdn 으로 불러와서 클립보든 복사 기능을 구현할 예정이다. 1. 스크립트 코드 스크립트 코드이며, class 선택자에 따라 동작하게 만들었다. 2. html 코드 test 입니다. copy 여기서 data-clipboard-action 부분은 복사할지 자를지에 대한 선택이며, 자르기 옵션은 cut 을 적어주면 된다. data-clipboard-target..
2022-09-07 암호화된 사용자 정보를 파라미터로 넘기는 과정에서 + 기호가 포함되어 있으면, 해당 기호가 공백으로 치환되어 전달되는 경우가 있다 이를 해결하는 방법을 알아보자. 1. 원인 아래의 참고링크에서 확인해보면 + 는 쿼리 스트링에서 하나의 의미를 가지는 문자열이기 때문에 이러한 문제가 나타난다고 한다. 비슷한 문자열로는 &를 예로 들 수 있다. 그래서 +를 적절한 다른 문자열로 치환을 해줘야 한다고 한다. 2. 해결 방법 아래와 같이 + 기호가 들어간 문자열을 encodeURIComponent 메소드로 감싸서 파라미터를 전달해주면 + 기호의 생략 없이 전달이 되게 된다. var param = vartest+12314 var encodedURL = "http://example.com/test..
2022-07-06 1. 방법 팝업창 호출을 a 태그에서 진행 시 발생할 수 있는 이슈사항으로 해결 방법은 아래와 같다. 함수 호출 뒤에 return false; 를 선언해 주면 기존 부모 창에 위치 변함없이 팝업창을 띄울 수 있다. 메인 이미지 출처 : Photo by Jason Hudson on Unsplash
2021-12-07 View에 존재하는 기존의 데이터를 복사해서 사용자에게 전달해야 하는 경우가 있다. 이러한 기능을 손쉽게 처리하는 방법을 알아보자. - 예제 사용할 자바스크립트 코드는 document.execCommand("copy");라는 명령어이다. 이는 view에서 현재 select()된 text를 클립보드에 복사해주는 기능을 수행한다. 아래의 예제 자바스크립트 함수 코드를 보자. //클릭했을 경우 클립보드에 복사된다. function clickCopy(value){ var tempInput = document.createElement("input"); tempInput.style = "position: absolute; left: -1000px; top: -1000px"; //input 창 생..
2021-11-20 팝업을 띄운 부모 창을 새로고침해야 하는 경우가 종종 있는데, 이럴 때 코드 한 줄로 부모 창을 새로고침 하는 방법이 있다. - 예제 function parentRefresh(){ opener.location.reload(); } 바로 위의 코드이다. 메소드명도 굉장히 명시적으로 표현되고 있으며 말 그대로 팝업을 띄운 부모 창(opener)의 경로(location) 정보를 새로고침(reload)한다. 위의 코드를 사용하면 기존의 부모창이 새로고침 되는 것을 확인할 수 있다. 메인 이미지 출처: Photo by XPS on Unsplash
2021-09-05 자바스크립트 함수를 호출할 때 a태그를 사용하여 호출하는 경우가 많은데 오늘은 이와 같은 방법을 빠르게 알아보자. -코드 사실 방법은 크게 두가지로 하는 href 링크를 이용해 자바스크립트 함수를 호출하는 방법이고 나머지 하나는 onclick 이벤트를 이용해 함수를 호출하는 방법이다.