요즘 작업을 하다보니..

javascript의 오브젝트를 많이 사용을 하게 되었다.

그래서 해당 내용을 간결하게 작성을 한다.


생성 :

var objectTest = {};

var objectTest2 = {"ID" : "ID03", "NAME" : "테스트3"};

var objectTestAll = {};


objectTest.ID = 'ID01';

objectTest.NAME = '테스트';


objectTestAll[objectTest.ID] = objectTest;


//초기화

objectTest = {};


objectTest.ID = 'ID02';

objectTest.NAME = '테스트2';


objectTestAll[objectTest.ID] = objectTest;


objectTestAll[objectTest2.ID] = objectTest2;


console.log(objectTestAll);


결과 :

objectTestAll {

"ID01" : {

"ID" : "ID01",

"NAME" : "테스트"

},

"ID02" : {

"ID" : "ID02",

"NAME" : "테스트2"

},

"ID03" : {

"ID" : "ID03",

"NAME" : "테스트3"

}

}



삭제 :

delect objectTestAll['ID02'];


console.log(objectTestAll);


결과 :

objectTestAll {

"ID01" : {

"ID" : "ID01",

"NAME" : "테스트"

},

"ID03" : {

"ID" : "ID03",

"NAME" : "테스트3"

}

}

아.. 오늘 완전히 삽질을 했다..
동일한페이지인데 팝업도 동일한 방식으로 열고..
그런데.. 이넘의 팝업에서 부모를 인식을 했다 안했다.. ㅠㅠ
그래서 window.name 을 부모에 주기도 하고 별별방법을 다했으나.
결국은 안되었다.... 

그러던중.. 찾은 녀석이 try catch 구문.. 솔찍히 오늘에서야 javascript에 try catch구문이 있다는 것을 알았다.. =_=;;
java에만 있는줄 알았다... 킁..

하여간 이녀석의 구문을 보면은.. 아주 간단하다.

try{
//실행을 해야되는 구문을 적는다.
}
catch(e){
// 위에 try안에 있는 구문이 오류가 날경우 실행이 된다.
alert("param값이 잘못되었습니다.");
return;
}
finally{
//위에 녀석들과는 상관없는 무조건 실행을 한다.
confirm("이대로 진행을 하시겠습니까?");
}

이런식의 구문이다..
이녀석을 사용하면 쉽게쉽게 할수 있던 일이였는데...
뭐.. 오늘에서야 알았으니.. 잊지 않겠다.. +_+
기본적인것이지만.
한번 남겨본다..

<body onload="javascript:xxtest();">
위와 같이 하면 body가 읽어지면 xxtest()라는 javascript function을 실행을 한다.
비슷한 방법으로는..

<script language="javascript">
window.onload = function() {
//내용
}
</script>
이러한 방법으로도 할수 있다.
오늘 작업을 하던중.
어쩔수 없이 팝업창에서 부모창(opener)으로 post방식으로 파라메타값들을 넘겨야됬다.. 우씨..
파라메타값이 외부적요인으로 늘어났기때문이다..

IE6, 7 에서 GET방식으로 넘기는 최대 URL길이는 2083character를 보낼수있는데.. 이것을 넘게 되어서.. 어쩔수 없는 선택이였다.. 
ps. 브라우저마다 GET방식으로 넘길수 있는 최대 URL길이가 틀리다.

그래서 선택의 여지가 없었다.. 자.. 그러면 팝업에서 부모창으로 post방식으로 파라메타값을 넘기는 방법은 의외로 간단하다.

//팝업창
var frm = document.form;
var url = "test.html";  //본인이 보내야되는 url을 쓴다.
frm.meta_info.value = "XXXXX"; //파라메타값을 셋팅을 한다.
frm.action = url;
frm.method = "post";
frm.target = opener.window.name;  //name는 변경하지 말고 그대로 사용. 부모창의 이름을 타겟으로 하겠다고 선언하는 것임.

frm.submit();
self.close();

//부모창(opener)
window.name = 'xxx';  //아무렇게나 넣어두 된다. 부모창에 기본적으로 이름이 없기에 이름을 주는것.

이렇게만 javascript에 넣으면은 된다.
당연히 function으로 만들어서 사용을 해야된다..

var today = new Date();
document.write(today.getYear(), '<br />');

- IE, 오페라 는: 2010 이라 나온다.
- 파폭,크롬,사파리 는: 109 이라 나온다.

죄길 금액계산하다가 크롬으로 테스트가 해주다 발견하게 되었다.
그러던중.. 찾은것은 getFullYear()이라는 함수다.
모든 브라우저에서 동일하게 결과를 보여준다 해서 저것으로 교체를 했다..
잊지 말자  getFullYear()

일을 하다가. 팝업을 띄우는데 팝업브라우저의 X버튼을 막으라고 해서..
여러군대를 찾다가..
예전 소스에 본인이 만들어 놓은곳에서 찾게 되었다.. ㅠㅠ


<script language=JavaScript>
function moveCheckYn()
{
event.returnValue = "창을 닫으시겠습니까?";
}
</script>


<body onbeforeunload="moveCheckYn();">

이렇게 하면 경고창을 띄우면서 진행여부를 묻는다..


window.open() 이거 가끔 사용을 하는데 오늘 회사에서 작업을 하다가 하게 되었다..
그런데 이거 왠걸... 옵션의 속성들을 다 까먹었다.. 부랴 부랴 인터넷에서 찾다가.. 내 블로그 있는데.
하면서 아래와 같이 작성을 한다. ㅎㅎ

사용법 : window.open("새창 페이지 주소(URL)", "새창이름", "옵션");
ex)
<script type="text/javascript">
function open_popup()
{
window.open('http://www.soulroad.net','SR','menubar=no,toolbar=no,location=no,status=no,scrollbars=no,width=520px,height=564px,left=0px,top=0px');
}
</script>

옵션 속성
menubar=no //메뉴바 X
toolbar=no // 툴바 X
location=no //주소표시줄 X
status=no //상태표시줄 X
scrollbars=no //스크롤바 X
fullscreen //최대창크기로 열기(최대화)
width //가로크기(px)
height //세로크기(px)
top //위에서부터 위치(px)
left //왼쪽에서부터 위치(px)
(px)되도록이면 써둘것.

간단한 브라우저 정보 알아오기이다.

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=EUC-KR">
<title>Navigator 객체를 이용한 사용자 브라우저 정보 알아보기</title>
</head>
<body>
<h2>브라우저 정보</h2>
<script type="text/javascript">


document.write("브라우저 코드 : " + navigator.appCodeName + "<BR>");
document.write("브라우저 이름 : " + navigator.appName + "<BR>");
document.write("브라우저 버전 : " + navigator.appVersion + "<BR>");
document.write("사용 언어 : " + navigator.language + "<BR>");
document.write("시스템 코드 : " + navigator.platform + "<BR>");
document.write("UserAgent : " + navigator.userAgent + "<BR>");
document.write("스크립트 가능 유무 : " + navigator.javaEnabled() + "<BR>");
document.write("오류 유무 : " + navigator.taintEnabled() + "<BR>");

</script>
</body>
</html>

일단 위와같고. navigator로 알아오는 것이다.

크롬, 사파리, 파이어폭스는 Netscape로 표기가 되고 오페라는 Opera로 익스플로어는 Explorer로 각각 브라우저 이름이 표기된다.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<script language="javascript">
<!--
var strLen;
function FFGetByteLength( obj ) {
    var msg = obj.value;
    var str = new String(msg);
    var len = str.length;
    var count = 0;
    for (k=0 ; k<len ; k++) {
        temp = str.charAt(k);

        if (escape(temp).length > 4) {
            count += 2;
        } else if (temp == '\r' && str.charAt(k+1) == '\n') { // \r\n일 경우
            count += 2;
        } else if (temp != '\n') {
            count++;
        }


        if ( count > 3000 ){
            strLen = k;
            break;
        }
    }
    return count;   
}

 

// 호출 method
function checkLength(formName) {

    alert (FFGetByteLength(document.all[formName].user_input));

     if ( FFGetByteLength(document.all[formName].user_input) > 3000){
     alert("메시지의 길이는 3000byte 이내여야 합니다.");
    tmpStr = document.all[formName].user_input.value.substring(0, strLen);
    document.all[formName].user_input.value = tmpStr;}
}
</script>

</HEAD>

 

<BODY>
<FORM METHOD=POST ACTION="" name='aa'>
<TEXTAREA NAME="user_input" ROWS="5" COLS="20"></TEXTAREA>
<INPUT TYPE="button"  onClick="checkLength('aa')" value="몇 Byte?">
</FORM>
</BODY>
</HTML>


<HTML>
 <HEAD>
  <TITLE>javascript exam</TITLE>
  <SCRIPT language="javascript" type="text/javascript">
  //<![CDATA[
    function fc_chk_byte(aro_name,ari_max) {
      var ls_str = aro_name.value;
      var li_str_len = ls_str.length;
      var li_max = ari_max;
      var i = li_byte = li_len = 0;
      var ls_one_char = ls_str2 = "";
      for(i=0; i< li_str_len; i++) {
        ls_one_char = escape(ls_str.charAt(i));

        if( ls_one_char.length == 1 ) li_byte++;
        else if( ls_one_char.indexOf("%u") != -1 )  li_byte += 2;//Db가 한글을 3byte로 인식하여 2->3
        else if( ls_one_char.indexOf("%") != -1 ) li_byte += ls_one_char.length/3;

  if(li_byte <= li_max){
   li_len = li_byte;
  }
      }

      if(li_byte > li_max) {
        alert( li_max + "byte, 초과 ");
        ls_str2 = ls_str.substr(0, li_len);
        aro_name.value = ls_str2;
        document.sms.char_byte.value = 3000;
      }else {
        document.sms.char_byte.value = li_byte;
      }
      aro_name.focus();
    }
  //]]>
  </SCRIPT>
 </HEAD>

 <BODY>
  <FORM METHOD=POST name="sms">
    <TEXTAREA NAME="txta" ROWS="12" COLS="52" onkeyup="fc_chk_byte(this, 3000)"></TEXTAREA>
    <br />
    <input type="text" size="4" name="char_byte" id="char_byte" readonly> / 3000 byte
    <input type="button" value="send" onclick="alert(document.sms.txta.value)" />
  </FORM>
 </BODY>
</HTML>

영문은 1byte로 한글은 2byte로 마춰져있다.
현재는 3000으로 마춰져있지만 fc_chk_byte(this, 3000) <-- 여기서 3000 을 자신이 원하는 수로 변경을 하면 수정이 가능하다.

+ Recent posts