Programming 썸네일형 리스트형 Ajax - XMLHttpRequest XMLHttpRequest(XHR) 객체는 Internet Explore5에서 ActiveX 컴포넌트 형식으로 가장 먼저 제공되었기때문에, 모질라와 사파리 웹브라우저에서 이 객체를 도입하기전까지 사실 많은 개발자들이 XMLHttpRequest 객체의 사용을 꺼려했다. XHR은 W3C 표준이 아니기 때문에 브라우저마다 작동방식에 있어서 다소나마 차이가 존재했었지만 현재 대부분의 브라우저들은 XHR 기능을 서로 비슷하게 구현하고 있다. 현존하는 브라우저들 중에서 XHR을 지원하지 않는 브라우저는 거의 없을정도로 대부분의 브라우저들은 현재 XHR 을 지원하고 있다. ajax 구현의 시작은 XHR 객체의 생성에서 시작한다. 위의 소스는 new 키워드를 사용하여 아주 간단하게 XMLHttpRequest 객체를 생.. 더보기 Ajax란? Ajax (Asynchronous Javascript And XML) Ajax는 비동기 JavaScript 및 XML의 약어이다.(DHTML도 마찬가지다.) Adaptive Path사의 Jesse James Garrett이 이 약어를 만들어냈으며, Jesse에 따르면 이 약어는 두문자어는 아니라고 한다. XMLHttpRequest와 자바스크립트를 이용한 비동기 데이터 교환 XML 및 XSLT를 통한 데이터 교환 및 이용 DOM을 함께 사용하여 다이나믹 표현 제공 XHTML 및 CSS를 이용한 표준 기반 표현 기법 Ajax 애플리케이션에 포함된 기본기술 웹 양식을 구축하고 애플리케이션 완료 때까지 사용되는 필드를 식별하는 데 HTML을 사용한다. 자바 스크립트 코드는 Ajax 애플리케이션을 실행하는 중심 .. 더보기 jQuery - 폼 지원 메소드 [ .submit( handler(eventObject)) ] Submit이 일어날 때 (서식이 전송될 때) 발생하는 이벤트 .submit( handler(eventObject) ) handler(eventObject) 이벤트가 발생하면 실행될 기능. .submit( [eventData], handler(eventObject) ) eventData 이벤트 핸들러에 전달될 데이터 맵. handler(eventObject) ) 이벤트가 발생하면 실행될 기능. .submit() .submit(handler(eventObject) 를 살펴 보면, 뒤에 handler라는 것이 존재를 하고 있다. .submit()을 호출하게 되면 정의된 handler를 실행하고 리턴 받은 Boolean값을 통해 서버로 데이터 전송.. 더보기 jQuery - 스타일 관련 메소드 [ .css() ] 적용된 스타일을 가져오거나, 새로운 스타일을 적용한다. css(propertyName) .css(propertyName) css(propertyName, Value) .css(propertyName, value) .css(propertyName, function(index, value) .css(map) $(“div”).css(“background-color”) $(“div”).css(“background-color”, “red”); 위의 소스는 이미 적용된 스타일을 가져오는 것이고, 아래의 예는 배경 색을 빨간색으로 지정하는 소스이다. $(“div”).css(“background-color”, function(index, value) { }); 와 같은 형식을 통해 자신이 원하는 기.. 더보기 jQuery Event - Browser Events jQuery Event - Browser Events .error() 오류가 발생할 때 발생되는 이벤트 .resize() 화면 크기가 변경될 때 발생하는 이벤트 .scroll() 스크롤이 움직일 때 발생하는 이벤트 [ .resize(handler(eventObject) ] 창의 크기가 변할 때 발생하는 이벤트 .resize( handler(eventObject) ) handler(eventObject) 이벤트가 실행될 때 동시에 수행될 기능 .resize( [eventData], handler(eventObject) ) eventData 이벤트 핸들러에 전달될 데이터 맵 handler(eventObject) 이벤트가 실행될 때 동시에 수행될 기능 .resize() resize 핸들러 안의 코드는 핸들러가.. 더보기 jQuery Event - .one() & .live() & .die() jQuery Event - .one() & .live() & .die() .one() .bind()와 동일하지만 이벤트가 한 번 실행된 후 .unbind()가 된다. .live() 앞으로 생성될 요소에도 이벤트 핸들러를 지정 이벤트 델리게이션(Event Delegation)을 사용하여 새로 생성되는 요소에도 이벤트가 적용된다는 점에서 .bind()와 다르다. .die() .live()로 생성된 이벤트 핸들러를 삭제한다. [ .one( events [, data], handler(eventObject)) ] .bind() 메소드와 동일한 방식으로 이벤트를 추가한다. 하지만 .one() 메소드를 통해 추가된 이벤트는 딱 한번만 실행이 되고 사라지게 된다. .one( events [, data], handle.. 더보기 jQuery Event - .bind() & .unbind() jQuery Event - .bind() & .unbind() .bind() 요소에 이벤트 핸들러를 지정 .unbind() 지정된 이벤트 핸들러를 삭제 [ .bind( eventType [, eventData] , handler(eventObject)) ] .bind() 메소드는 말 그대로 개체와 이벤트를 묶어주는 역할을 한다. .bind( eventType [, eventData], handler(eventObject) ) eventType 하나 이상의 DOM 이벤트를 표현하는 문자열. "click", "submit," 또는 사용자가 만든 함수들(사용자정의함수). eventData 이벤트 핸들러에 전달하기 위한 데이터 집합(map of data). handler(eventObject) 이벤트와 함께 실.. 더보기 jQuery Event - Document loading jQuery Event - Document Loading .load() 페이지 로딩이 완료되었을 때 발생하는 이벤트 .ready() DOM이 모두 준비 되었을 때 발생하는 이벤트 .unload() 페이지를 벗어날 때 발생하는 이벤트 [ .load(handler(eventObject) ] load 이벤트는 모든 요소들이(포함한 하위 요소까지도) 완전히 읽혀(load)졌을 때 발생합니다. 이 이벤트는 a URL: images, scripts, frames, iframes, 그리고 window 객체와 같은 특정한 요소들에서 사용할 수 있다. .load( handler(eventObject)) handler(eventObject) 이벤트가 발생했을 때 실행될 기능. .load( [eventData], handl.. 더보기 jQuery Event - Form Events jQuery Event - Form Events .focus() 요소에 포커스 되었을 때 발생하는 이벤트 .blur() 요소에서 포커스를 잃을 경우에 발생하는 이벤트 .change() , , 요소의 값 변경 시 발생하는 이벤트 .select() 선택한 개체를 마우스를 통해 선택 하였을 때 발생하는 이벤트 .submit() Submit이 일어날 때(서식이 전송될 때) 발생하는 이벤트, return false로 서식 전송을 막을 수 있다. [ .focus( handler(eventObject) ) ] focus 이벤트는 요소가 포커스를 획득하면 발생한다. .focus( handler(eventObject) ) handler(eventObject) 이벤트가 발생하면 실행될 기능 .focus( [eventDat.. 더보기 jQuery Event - Keyboard Events jQuery Event - Keyboard Events .keydown() 키 입력 시 발생되는 이벤트, 모든 키에 대해 적용이 된다. .keypress() keydown이벤트와 동일하게 키 입력 시 발생이 되지만 enter, tab등 특수키에는 발생하지 않는다. .keyup() 키 입력 후 발생되는 이벤트 [ .keydown(handler(eventObject) ] 키 입력 시 발생되는 이벤트, 모든 키에 대해 적용이 된다 .keydown( handler(eventObject) ) handler(eventObject) 이벤트가 발생되면 실행될 기능 .keydown( [eventData], handler(eventObject) ) eventData 이벤트 핸들러에 전달될 데이터 집합 handler(eve.. 더보기 이전 1 2 3 4 5 6 7 다음
