자바스크립트29 [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. [bootstrap] 부트스트랩 – 전체 너비 내비게이션 메뉴바 [냅바(navbar)] & 검색입력창(searchbox) 부트스트랩 전체너비 내비게이션 메뉴바입니다. 그리고, 검색입력창(searchbox)가 들어 있는 샘플입니다. [Edit in jsfiddle] 클릭해서 확인하세요. 2018. 5. 11. [bootstrap] 부트스트랩 – 전체 너비 내비게이션 메뉴바 [냅바(navbar)] & 검색입력창(searchbox) [검은색 테마] 부트스트랩 전체 너비 내비게이션 메뉴바 검은색 테마입니다. 2018. 5. 11. [자바스크립트] 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. [java/jsp] js 파일 안에서 아무리 소스를 수정해도 브라우저에 바로바로 반영이 안된다면? 저도 이것 때문에 많이 헤맸습니다. 아무리해도 js 파일에서 소스를 고쳐도 화면에서 반영이 되어 보이질 않더라구요. html, jsp 파일은 오히려 바뀐 소스가 잘 반영되더라구요. html, jsp 파일 안에서 코딩한 자바스크립트 소스도 잘 반영됩니다.그런데, js 파일만은 반영이 안 되네요 ㅠ 2015/05/29 - [인터넷/컴퓨터/구글] - [구글] Google 크롬(chrome) 브라우저에서 캐시 무시하고 화면 불러오기 (강제 캐시 삭제 X)이 방법도 안 먹히더라구요 ㅠ 그런데, 정말 생각보다 간단한 방법이 있더라구요. System.currentTimeMillis() 자바의 현재시간을 표시해주는 내부함수를 이용하면 됩니다. 이런식으로 js 파일을 링크하는 곳에 붙여보세요. ?v= 소스보기를 하면 이.. 2016. 11. 11. [자바스크립트] 브라우저 크기(너비, 높이) 및 브라우저 화면 사이즈 브라우저의 크기를 확인 하는 명령어는 다음과 같습니다.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. 이전 1 2 다음