-
Javascript, jQuery 2017‧08‧31
jQuery - 체크된 라디오 버튼 선택
<input type="radio" name="selectTemplate" value="0"> <input type="radio" name="selectTemplate" value="1"> <input type="radio" name="selectTemplate" value="2"> 이렇게 그룹된 라디오 버튼이 있을 때 선택된 것이 있는지 체크하려면 아래 선택자를 활용하자. $('input[name=selectTemplate]:checked')
-
Javascript, jQuery 2017‧07‧18
npm 옵션 (단축키)
npm - 옵션을 찾을 때가 있어서 적어놓는다. -v: --version -h, -?, --help, -H: --usage -s, --silent: --loglevel silent -q, --quiet: --loglevel warn -d: --loglevel info -dd, --verbose: --loglevel verbose -ddd: --loglevel silly -g: --global -C: --prefix -l: --long -m: --message -p, --porcelain: --parseable -reg: --registry -f: --force -desc: --description -S: --save -P: --save-prod -D: --save-dev -O: --save-optional -B: --save-bundle -E: --save-exact -y: --yes -n: --yes false ll and la commands: ls --long 공식 문서파일은 : https://docs.npmjs.com/misc/config#shorthands-and-other-cli-niceties
-
Javascript, jQuery, Reactjs 2017‧05‧18
Webpack + React 그리고 SCSS 컴파일해서 CSS 넣기
모듈 설치 npm install --save-dev style-loader css-loader sass-loader node-sass cmd를 실행해서 프로젝트 디렉토리로 이동하여 npm으로 모듈들을 설치하자. 이제 아래 두가지 방식 중 선택하여 작업한다. 1. .css 파일을 뽑아내지 않고 React에 담는 방식 2. .css 파일을 따로 만들어서 직접 html 안에 담는 방식 (<link rel="stylesheet" ... > 태그로 흔히 우리가 기본적으로 사용하는 그 방법) 1번 방식은 […]
-
Javascript, jQuery 2017‧04‧26
JS-호이스팅(hoisting)
갑자기 호이스팅이라고 들었을 때 무엇인지 궁금했다. 찾아보니 스크립트 작성할 때 이미 쓰고 있는? 혹은 자연스럽고 당연스럽게 쓰여지고 있었다. 독학의 단점은 이렇게 명칭이 뭔지 모를 때가 있고 가끔 개념 정리중에 누락된게 있다. 먼저 호이스팅 간단하게 정리하기 전에 함수 쓰는거에도 명칭이 있었더라 (난 필요에 따라 편한대로 썼었는데 얘들도 이름이 있었다는거에 너무 미안했다 ㅠ) 함수 선언문 : function test(){}; […]
-
Javascript, jQuery 2017‧03‧27
JS - textarea 폰트 사이즈 변경
제이쿼리로 하면 간단하지만 자바스크립트로 폰트 사이즈를 직접 변경할 때 아래처럼 getElementById로 선택자를 선언하고 수정하면 된다. document.getElementById("엘리먼트ID").style.fontSize = '20px'; 만약 클래스값으로 선택하고자 한다면 getElementsByClassName('클래스명') 이렇게만 지정하면 오류난다. 못찾는다. getElementsByClassName('클래스명')[0] 이렇게 순번을 넣어 개별적으로 선언해주어야 오류나지 않는다.
-
Javascript, jQuery 2017‧03‧17
PC와 모바일에서 텍스트를 클립보드에 복사 시키기
현실적으로 ios와 안드로이드 및 pc를 만족시키는 클립보드 스크립트는 없다. 기기마다 또는 os 마다 보안 정의도 다르기 때문이기도 하다. 아무튼 이 모든 기기를 만족시켜주기 위해서 두개의 플러그인을 사용해서 이용해보았다. clipboard.js : https://clipboardjs.com/ copy2clipboard.js 자세한 사용법은 각 사이트를 참고하면 되고, 아래는 작성해본 코드이다. <script src="./js/clipboard.min.js"></script> <script src="./js/copy2clipboard.js"></script> head 안에 넣어서 스크립트를 로드 시킨다. <textarea name="copytextarea" id="copytextarea" cols="30" rows="2" […]
-
Javascript, jQuery 2017‧03‧02
자바스크립트를 이용해 위도,경도를 주소로 변환하기
위도 경도 데이터는 있는데 이를 주소명, 지역명으로 변환하고 싶을 때 사용한다. API 키 발급과 정보 : https://developers.daum.net/services/apis/local/geo/coord2addr var lon = '경도'; var lat = '위도'; $.ajax({ url: 'https://apis.daum.net/local/geo/coord2addr?apikey=발급받은API키&longitude=' + lon + '&latitude=' + lat + '&inputCoordSystem=WGS84&output=json', type: 'GET', cache: false, context: {}, crossOrigin: true, success: function(data) { var jsonObj = $.parseJSON(data); var contentText = document.getElementById('content'); contentText.innerHTML […]
-
Javascript, jQuery 2017‧03‧02
체크박스 라벨을 이미지 만들었고 클릭해도 반응 없을 때
input 중에 checkbox를 만들고 checkbox는 안보이게 포지션 잡은 뒤 label안에 디자인된 체크박스를 넣었을 때 가끔 이 안의 이미지를 눌러도 checkbox 값이 변경되지 않는 경우가 있다. 이럴 때 스크립트를 넣어주자. $("label img").on("click", function() { $("#" + $(this).parents("label").attr("for")).click(); });
-
Javascript, jQuery 2017‧02‧23
input에 숫자만 입력받기 (최종판을 위해...)
숫자만 입력받는 방법은 무수히 많다. 숫자외 문자를 입력하면 글이 안써지게 하는 코드 (아쉽게 한글은 완성형으로 해당이 안된다.) css로 ime-mode 를 disabled 해서 한글은 안써지게 하는 코드 (아쉽게 크롬은 반응이 없다.) 또 어렵사리 만들어 놓으니 초성만 쓰고 탭을 눌러 이동하면 그 초성이 input칸에 남아있다. 등등 수 많은 팁들이 있지만 우리나라 한글도 못쓰게하고 숫자만 쓰게 하려면 좀 […]
-
Javascript, jQuery 2017‧01‧13
JS - 모바일 접속 체크
window.mobilecheck = function() { var check = false; (function(a){if(/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino/i.test(a)||/1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i.test(a.substr(0,4))) check = true;})(navigator.userAgent||navigator.vendor||window.opera); if( navigator.userAgent.match(/Android/i) || navigator.userAgent.match(/webOS/i) || navigator.userAgent.match(/iPhone/i) || navigator.userAgent.match(/iPad/i) || navigator.userAgent.match(/iPod/i) || navigator.userAgent.match(/BlackBerry/i) || navigator.userAgent.match(/Windows Phone/i) ){ check = true; } return check; }; 와와 […]