프로그래밍 언어/자바스크립트24 [JavaScript] inputbox에 숫자와 백스페이스(←)만 Key-In(입력)되게 하는 자바스크립트 소스 See the Pen Input Only Number & Backspace by Woojin Choi (@woojin-choi) on CodePen. Inputbox에 숫자와 백스페이스(←)만 Key-In되게 하는 자바스크립트입니다. event.keyCode로 제어합니다. 문자가 입력되었다 사라지는 게 아니고 아예 문자는 입력이 안됩니다. 2018. 11. 20. [자바스크립트] javascript로 iframe에 동적으로 소스를 추가하거나 변경하는 방법 이런식으로 iframe에는 파일을 하나 만들어서 src 속성으로 넣었는데요. 파일이 없어도 iframe에 소스를 추가하거나 변경할 수 있습니다. 소스에 주석이 돼 있으므로 설명은 생략합니다. 2018. 5. 24. [javascript] 자바스크립트로 json 변수에 담겨있는 key value 추출 방법 json 변수에 key, value값이 뭐가 들어있는지 알고 싶을 때 사용할 수 있는 예제입니다.123for(var key in json) { $("#jsonList").append(""+ key +":"+ json[key] +"");}Colored by Color Scriptercs 긴 설명은 필요없고 이 부분만 잘 확인하시면 됩니다. 2018. 5. 24. [자바스크립트] javascript의 치환(replace)할 값을 변수로 받아서 사용하는 예제 str.replace(/abc/gi, “x”); “abc”라는 값을 “x”로 바꾸고 싶으면 보통 이런식으로 사용하는데요. 변수에 “abc” 값을 넣고 replace하는 예제입니다. 2018. 5. 11. [자바스크립트] javascript에서 1이상 증가하는 for문 사용 예제 자바스크립트 for문은 항상 이렇게 사용했었는데... for( var i = 0; i i+1 이 아니라 i=i+1 즉, i+=1과 같다는 생각이 들었습니다. 그래서, 다시 다음과 같이 해봤습니다. for( var i = 0; i < length; i+=10 ) { ...... } 다시 이렇게 코딩하니 잘 동작하네요.1이상씩 증가하거나 감소해야하는 for문이 필요하시다면 참조하세요. 2017. 6. 14. [자바스크립트] 브라우저 크기(너비, 높이) 및 브라우저 화면 사이즈 브라우저의 크기를 확인 하는 명령어는 다음과 같습니다.window.innerWidth : 브라우저 화면의 너비 window.innerHeight : 브라우저 화면의 높이 window.outerWidth : 브라우저 전체의 너비 window.outerHeight : 브라우저 전체의 높이 아래 그림을 보면 이해하는데 더 도움이 되겠네요^^ 2016. 2. 24. [자바스크립트] javascript로 파일 용량 체크하기 파일 용량 체크하는 함수입니다. 이렇게 파일첨부하는 박스가 있을 때, 파일 선택시 파일의 용량은 아래와 같이 확인하시면 됩니다. document.fileForm.file1.files[0].size 2016. 2. 17. [자바스크립트] javascript로 글자 byte 계산 및 byte만큼 자르기 글자의 byte를 계산하고 byte만큼 자르는 예제입니다. charByteSize(ch) : 한글자에 대한 byte를 계산합니다. getByteLength(s) : 입력된 글자 전체의 byte를 계산해서 알려줍니다. cutByteLength(s) : 원하는 byte 만큼 글자를 잘라서 반환합니다. 2016. 1. 14. [자바스크립트] javascript로 selectbox 위아래 이동하게 구현하기 멀티 selectbox에서 위아래 이동하게 하는 예제입니다. 2016. 1. 14. [자바스크립트] javascript로 선택한 이미지 base64 코드로 변환하여 화면에 보여주기 이미지를 base64 인코딩하여 보여줄 수가 있습니다. 보통 이미지들은 이런식으로 이미지의 경로를 표시하여 이미지를 화면에 보여주는데요. 이런식으로 base64 코드로 이미지를 보여줄수도 있답니다. 보통 이미지를 DB로 저장했다가 화면에 불러와서 보여줄 때 사용하는 방식인데요. 이미지가 많을 경우는 이 방식이 속도가 느리다고 하니 사이트 상황에 맞게 사용하시면 될 것 같습니다. 아래 예제는 이미지를 선택하면 이미지를 base64로 인코딩하여 코드값으로 화면에 바로 출력하는 예제입니다. 이미지를 따로 정해진 경로에 저장하지 않아도 되므로 간편하게 사용할 수 있답니다. 2016. 1. 14. [자바스크립트] javascript로 contextPath 구하는 함수 만들어 사용하기 function getContextPath() { var hostIndex = location.href.indexOf( location.host ) + location.host.length; return location.href.substring( hostIndex, location.href.indexOf(‘/’, hostIndex + 1) ); }; 물론, contextPath가 존재할 때만 사용하셔야 합니다. 안 그럼 엉뚱한 값을 가져오게 되니까요. contextPath를 구하는 함수입니다. http://localhost:8080/test/code/codename.do URL 주소가 위와 같다면 /test 라는 contextPath를 구하게 됩니다. 만약, 네이버 블로그를 가입해서 운영하신다면 htt.. 2015. 7. 29. [자바스크립트] javascript 변수나 함수의 존재여부를 확인해 주는 연산자 typeof 나름 자바스크립트를 잘 사용한다고 생각했었는데 여태 typeof라는 연산자를 모르고 있었다니 부끄럽네요.오늘 코딩을 하다가 '함수가 있는지 없는지 존재여부를 확인하려면 어떻게 하지?'하는 궁금증이 생겼습니다.해당 함수의 존재여부를 알아야 하는 작업이었거든요. 그래서, 오늘에서야 드디어 typeof 연산자의 존재를 알았네요.var flag; if (typeof foo == 'undefined') { flag = false; } else { flag = true; }console.log(flag); 이런식으로 사용한다고합니다.위 예제에서는 foo라는 변수나 함수가 존재하지 않으니 false가 console에 찍히겠죠? http://koxo.com/lang/js/operator/typeof.html여기 가보시.. 2015. 7. 22. [자바스크립트] javascript 파일 압축 및 복원하기 (***.min.js 파일 만들기) 요즘엔 자바스크립트 파일을 배포할 때 파일을 압축해서 ***.min.js 형식으로 배포를 합니다.jQuery 파일의 경우,jQuery-2.1.1.js jQuery-2.1.1.min.js 이런식으로 배포를 하는데요.압축된 파일을 열어보면 빈 공간없이 소스가 한줄로 다 붙어 있는 걸 볼 수 있습니다. 이렇게 압축을 하는 이유는, 용량을 조금이라도 줄여서 조금이라도 화면이 뜨는 속도를 빨리하기 위함입니다.그럼, 압축과 복원 방법을 알아보겠습니다. 자바스크립트 파일 압축하기 자바스크립트를 압축해주는 곳은 여러곳이 있지만, 대표적인 곳이 javascriptcompressor입니다.아래 링크로 들어가서 원하는 소스를 넣고 [compress] 버튼을 눌러주시면 변환이 됩니다.http://javascriptcompre.. 2015. 4. 24. [자바스크립트] javascript로 구현하는 인코딩, 디코딩 함수 - Xor 암호화 자바스크립트로 구현하는 인코딩, 디코딩 함수 - Xor 암호화 소스 변환 중 내용보기 설명 이 암호화의 특징은 Key를 입력한다는 것입니다.key를 2개 입력해서 사용하는데, key를 영어로 하면 영문과 특수문자로.. key를 한글로 하면 한글과 특수문자로 암호화됩니다. 참고하셔서 유용하게 사용하시기 바랍니다. [출처] http://th.atguy.com/mycode/xor_js_encryption/ [출처] http://aseuka.tistory.com/321 실행 [새창] [새창(소스포함)] 2015. 4. 15. [자바스크립트] javascript - 삼성 주차관리 자바스크립트 소스 삼성에서 사용하는 주차관리 소스입니다. 소스에 주석이 있으므로 소스 설명은 따로 하지 않습니다. 2015. 4. 13. 이전 1 2 다음
