공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday

티스토리 뷰

■ 프론트엔드 ■/AJAX

01. XMLHttpRequest 함수화 기본형

serpiko 2014. 8. 28. 17:30

<!DOCTYPE html>

<html>

<head>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> 


<script>


function fnLoadJSON(url) {

  if (window.XMLHttpRequest) {

    var request = new XMLHttpRequest(); // IE7+, Firefox, Chrome, Opera, Safari

  } else {

    var request = new ActiveXObject('Microsoft.XMLHTTP'); // code for IE6, IE5

  }


  request.open('GET', url, false);

  request.send();


  return  (request.responseText); // parse adn return the output

};


$(document).ready(function(){

var myObj = fnLoadJSON('http://ipaddress/data.php?Act=test');

/***************************************

* ※데이터 주의사항.

*

* 1. 문자열일 경우 직접 사용 가능.

*    myObj; //serpiko

*

* 2. 오브젝트일 경우 eval로 값으로 변환해야 하는데 이때 '()'로 감싸준다.

*    데이터 형식 : {'label':'serpiko', 'value':'99999'}

*    var myData = eval( '('+ myObj.resonseText + ')' ); //

*    myData.label

*    myData.value

*

* 3. 반복된 오브젝트({~~},{~~}... )일 경우 eval로 값으로 변환해야 하는데 이때 '[]'로 감싸준다.

*    데이터 형식 : {'label':'serpiko', 'value':'99999'}, {'label':'serpiko', 'value':'8888'}

*    var myData = eval( '['+ myObj.resonseText + ']' );

*    myData[0].label

*    myData[1].value

***************************************/

myObj = eval( "(" + myObj + ")" );

console.log(myObj.color);

});


</script>


</head>


--------------------------------------------------------------------------------------------------------------------


<?php


if ($Act == "test") 

{

    echo "{'label':'msupdak.myhost.to', 'value':56919, 'color':'#ff0f00'}";

}


?>

저작자표시 비영리 동일조건

'■ 프론트엔드 ■ > AJAX' 카테고리의 다른 글

03. 제이쿼리 load → JSON데이터  (0) 2014.08.28
02. XMLHttpRequest 함수화 - sendRequest(url, param, callback, method, asyncBool)  (0) 2014.08.28
XMLHttpRequest  (0) 2014.08.28
HTTP 상태 코드(status)  (0) 2014.08.28
setRequestHeader() - HTTP헤더 설정  (0) 2014.08.28
댓글