동해둘리의 IT Study

javascript undefined 와 null 자바스크립트로 작업을 하는경우, 사용자의 입력값을 확인하는 등의 작업을 할때 간혹 마주치는 것이 undefined 와 null 입니다. typeof 로 확인가능 특정 객체의 undefined 또는 Null 유무는 typeof 로 확인이 가능합니다. javascript 의 typeof 는 아래와 같은 형식으로 사용하면 됩니다. 1 2 3 4 5 6 7 8 9 10 11 var num = 42; var str = "Hello"; var bool = true; var obj = { key: "value" }; var func = function() { }; console.log(typeof num); // 출력: "number" console.log(typeo..

IT공부방/jQuery, ajax, java 2023. 8. 25. 09:24

이미지변경시 이미지 클릭하면 파일선택창 바로 띄우기 이미지를 변경하고자 할때, input 태그를 사용하면 화면에 파일선택바가 나타나게 되는데요, 아래의 빨간색 부분과 같이 해당 이미지를 클릭하면 바로 파일선택창이 뜨도록 하고 싶을때가 있습니다 즉, 아래와 같이 동작하게 하고 싶은경우 입니다 전체 코드는 다음과 같습니다. 간략하게 설명드리면 우선, id가 target_img인 부분이 변경하고자 하는 이미지 입니다. 그 이미지가 클릭될 경우 태그 내에 있는 target_url 부분에 선택된 이미지 URL 을 세팅하고, 파일태그에 클릭이벤트를 발생시키는 겁니다. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 $('#target_img').click(function (e)..

IT공부방/jQuery, ajax, java 2020. 7. 8. 09:51

안드로이드에서 웹뷰를 생성하여 웹사이트를 로드한 경우, 웹뷰내에 로드된 페이지에서 특정 버튼이나 메뉴가 클릭되었을 경우,안드로이드 코드내의 특정 Javascript 함수를 호출해야 하는 경우가 있다. 반대로, 안드로이드 쪽에서 버튼이나 메뉴를 클릭했을 때, 웹뷰내에 로드된 페이지의 특정 Javascript 함수를 호출해야하는 경우가 있다 먼저, 안드로이드 에서 웹뷰에 로드된 페이지의 Javascript 함수를 호출하려면 아래와 같이 호출하면 된다. mWebView.loadUrl("javascript:TestFunction()"); 웹뷰내의 페이지에는 다음과 같이 구현되어 있어야 한다. function TestFunction() { // 웹페이지에서 실행할 동작을 기술} 반대로, 웹뷰내의 페이지에서 안드로..

IT공부방/안드로이드 Android 2018. 10. 2. 02:14

웹사이트 내에서 마우스클릭 이벤트가 발생한 경우에 마우스클릭위치를 알아내는 방법입니다 이부분을 클릭하면 클릭된 위치의 X좌표와 Y좌표를 표시합니다 위와같이 하면 태그나 태그를 클릭할 경우, 클릭된 위치의 X좌표와 Y좌표값을 알 수 있습니다. 아울러, 클릭된 태그(엘리먼트)의 종류를 알아내려면 다음과 같이 하면 된다 function showCoords(event) { var targ; if (!e) { var e = window.event; } if (e.target) { targ=e.target; } else if (e.srcElement) { targ=e.srcElement; } var tname; tname = targ.tagName; alert("지금 클릭된 태그명은" + tname + " 입니다 ..

IT공부방/jQuery, ajax, java 2018. 3. 27. 10:46

CSS 속성중에서 z-index 라는 값이 있죠.... This is a heading 예를 들어, 위와 같이 코딩했을 경우, 엘리먼트가 엘리먼트보다 위에 표시되게 됩니다. 엘리먼트가 엘리먼트보다 먼저 코딩되어 있기 때문에, 정상적이라면 나중에 코딩된 엘리먼트가 위에 올라가는게 맞지만, z-index 속성을 -1 로 주었기 때문에, 이런 상황이 생기게 됩니다. 이번 포스팅에서 강조하려고 하는 것은, CSS 로 설정된 z-index 값을 javascript 를 이용하여 동적으로 변경시키는 것입니다. 이때, 흔히 하기 쉬운 실수가 바로 아래와 같이 코딩하는 것입니다. 하지만, 이렇게 하면 z-index 가 제대로 작동하지 않고 ERROR 가 발생하게 됩니다. 보통, style 속성을 변경하고자 할때 아래와 ..

IT공부방/HTML5, CSS 2017. 2. 3. 22:03

1. 처음으로 발견되는 문자열 위치 찾는 함수 indexOf() javascript 코딩시에, 특정 문자열에서 원하는 문자/문자열을 찾을 때 사용하는 함수로 indexOf() 함수를 사용합니다. array.indexOf(item, start) ParameterDescriptionitemRequired. The item to search forstartOptional. Where to start the search. Negative values will start at the given position counting from the end, and search to the end. var str = "Hello world, welcome to the universe."; var n = str.indexO..

IT공부방/jQuery, ajax, java 2017. 1. 2. 21:59

javascript 문자열 함수중에 substring 함수가 있는데요저는, 파일확장자를 구별해서 사용할대 자주 사용을 하게 됩니다. 보통, 아래와 같이 사용하고는 하죠...... var nLength = filename.length;var sExtension = filename.substring(nLength - 3, nLength ); if ( sExtension == "mp3" ) { }else if ( sExtension == "jpg" ) { }else {} 뭐, 기술적으로 어려운건 아니지만, 가끔 코드찾아보기 귀찮을때가 있어서 블로그에 남겨봅니다.

IT공부방/jQuery, ajax, java 2016. 10. 3. 16:39

JavaScript 에서 문자열내의 특정 문자를 변환하고자 할 때, replace() 함수를 사용하게 되는데, javascript 의 replace() 함수는 문자열내에서 처음 발견되는 문자만 변환하게 됩니다. 1 2 3 4 5 var sOriginText = " 동해바다 서해바다 남해바다 "; var sConvertedText = sOriginText.replace("바다","산"); alert(sConvertedText ); cs 위 코드를 실행하게되면 결과값이 동해산 서해산 남해산 이렇게 나오는 것이 아니라 동해산 서해바다 남해바다 와 같이, 처음 발견되는 동해바다의 '바다' 만 '산' 으로 바꾸게 됩니다. 문자열 전체의 문자를 바꾸고 싶은경우 아래와 같이 코딩하면 가능합니다. 1 2 3 4 5 6..

IT공부방/jQuery, ajax, java 2016. 9. 8. 14:02

Javascript 와 CSS 를 이용하여 만든 PopUp 창 띄우는 에제입니다. Javascript 와 CSS 를 이용하여 PopUp창을 띄우는 예제입니다 팝업내에 표시되는 내용입니다 본 포스팅은 아래 포스팅을 참고했습니다. http://www.w3schools.com/howto/tryit.asp?filename=tryhow_js_popup

IT공부방/jQuery, ajax, java 2016. 8. 25. 16:07

JavaScript 에서 소숫점 이하자리까지 계산하는 경우, 오류가 생기는 경우가 있습니다. 아래와 같은 경우 인데요 1 2 3 4 5 6 7 8 9 var fVal_1 = "0.6"; var fVal_2 = "0.3"; var fResult = parseFloat(fVal_1) + parseFloat(fVal_2); alert(fResult); // 0.899999999999 로 표시됨 cs 위의 경우 fResult 값은 0.9 가 정답이지만, 0.8999999999999 로 표시되는 것이다. 이때, 아래와 같이 toFixed() 함수를 이용해주면 됩니다. 1 2 3 4 5 6 fResult = fResult.toFixed(2); alert(fResult); // 0.90 으로 표시됨 Colored b..

IT공부방/jQuery, ajax, java 2016. 8. 23. 12:44

1. CSS 의 z-Index This is a heading 위와 같이 코딩되어 있을경우, 태그의 내용이 태그 위에 올라가 보이게 된다. 왜냐하면 img 태그의 z-index CSS속성을 -1 로 세팅했기 때문이다. 2. Javascript 의 z-index document.getElementById("img1").style.zIndex = "1"; zIndex 는 위와같이 DOM 엘리먼트의 속성이다. CSS 와는 다소 다르다. 아래 링크 참조 http://www.w3schools.com/jsref/prop_style_zindex.asp

IT공부방/HTML5, CSS 2016. 8. 2. 12:15

1. addEventListener 함수 선택된 엘리먼트에 이벤트리스너 를 부착한다. 아래 코드의 경우 click 이벤트가 발생하기를 기다리다가 , 해당 이벤트 발생시 해당함수 실행한다. 1 element.addEventListener("click", function(){ alert("Hello World!"); }); cs 위 코드는 외부 함수로 설정해서 코딩할 수 도 있다. 1 2 3 4 5 element.addEventListener("click", myFunction); function myFunction() { alert ("Hello World!"); } Colored by Color Scripter cs 또한, 여라가지 이벤트에 대한 리스너 설정도 가능하다 1 2 3 4 5 element.a..

IT공부방/HTML5, CSS 2016. 7. 25. 15:33

웹사이트 개발시, PC환경에서 접속을 했는지 모바일에서 접속을 했는지 확인하기 위한 javascript 코드 입니다. navigator 객체의 platform 속성을 이용하여 확인을 하게 됩니다.아래 링크는 navigator 객체의 Platform 속성에 대한 정의입니다. http://www.w3schools.com/jsref/prop_nav_platform.asp 정의에 의하면, platform 속성에 가능한 값은 아래와 같습니다. Win16 : 16비트 윈도위기반 컴퓨터Win32 : 32비트 윈도위기반 컴퓨터Win64 : 64비트 윈도위기반 컴퓨터MacIntel : 인텔CPU 를 가진 매킨토시 컴퓨터Mac : 매킨토시컴퓨터이상, 5가지 정도의 값이 PC접속시 발생가능한 속성이며 기타 속성은 무시하거나..

IT공부방/jQuery, ajax, java 2016. 7. 19. 14:55