> php教程 > PHP开发 > 본문

jQuery 시작 튜토리얼 - AJAX 사용

黄舟
풀어 주다: 2016-12-14 16:38:34
원래의
1155명이 탐색했습니다.

이 부분에서는 youtube.com에서 볼 수 있는 것과 마찬가지로 무언가를 평가할 수 있는 작은 AJAX 애플리케이션(Keel의 메모: 무언가에 투표하는 것)을 작성했습니다.
먼저 서버측 코드가 필요합니다. 이 예에서는 평점 매개변수를 읽고 총 평점 수와 평균을 반환하는 데 PHP 파일이 사용됩니다. rate.php 코드를 살펴보세요.
이 예제는 AJAX를 사용하지 않고도 구현할 수 있지만 jQuery를 사용하여 ID가 ​​"rated"인 DIV 컨테이너를 생성하지는 않습니다.$( document).ready( function() {
                                                                                            ~                         .length] = "" + i + " ";
        }
                                    ~ ").append( ratingMarkup.join('') ).find("a").click(function(e) {
            e.preventDefault();
                                                 >  > , $ ( "count", xml) .text () }); }); ". 링크 중 하나를 클릭하면 링크에 표시된 점수가 평가 매개변수 형식으로 rate.php로 전송됩니다. 그런 다음 결과는 서버에서 XML 형식으로 반환되어 컨테이너에 추가됩니다. 이 링크를 대체합니다.

PHP가 설치된 웹서버가 없다면 이 온라인 예제를 살펴보세요.
자바스크립트를 사용하지 않는 예제는 Softonic.de를 방문하여 "Kurz bewerten!"을 클릭하세요. "

더 많은 AJAX 방법은 여기에서 찾거나 AJAX 아래에 제출된 AJAX를 살펴보세요. 결과를 보려면 로딩 추가, 다시 투표할 반환 링크 추가 등 수정을 고려할 수 있습니다. 이 외에도 아직 더 소화해야 할 부분이 많습니다.)

자주 발생하는 문제입니다. AJAX를 사용하여 콘텐츠를 로드하는 경우 이벤트 핸들러를 HTML 문서에 로드할 때 로드된 콘텐츠에 이러한 이벤트를 적용해야 하며, 코드가 실행되는 것을 방지하려면 로드가 완료된 후 이러한 이벤트 핸들러를 적용해야 합니다. 다음 함수를 반복적으로 사용할 수 있습니다: $(function() {
var addClickHandlers = function() {
$("a.clickMeToLoadContent").click(function() {
                                    ~
}); 이제 addClickHandlers는 DOM이 로드된 후 한 번만 실행됩니다. 이는 사용자가 clickMeToLoadContent 스타일이 있는 링크를 클릭하고 콘텐츠가 로드될 때마다 실행됩니다.

addClickHandlers 함수는 다음과 같이 사용됩니다. 전역 변수(예: function addClickHandlers() {...}) 대신 정의된 지역 변수는 다른 전역 변수 또는 함수와의 충돌을 방지하기 위해 수행됩니다.

또 다른 일반적인 질문은 콜백(콜백)에 관한 것입니다. ) 매개변수. 추가 매개변수를 통해 콜백 메소드를 지정할 수 있습니다. 간단한 방법은 콜백 메소드를 다른 함수에 포함시키는 것입니다. // 데이터 가져오기
var foobar = ...;
// 핸들러 지정, 데이터가 필요합니다. 매개변수로
var handler = function(data) {
...
};
// 클릭 핸들러를 추가하고 foobar를 전달합니다!
$('a') .click( 함수 (event) { handler(foobar); } );

// 원래 핸들러의 컨텍스트가 필요한 경우 apply:
$('a').click( function (event) { handler.apply(this, [foobar]); } );간단한 AJAX를 사용하고 나면 이미 매우 "web2.0"이라고 생각할 수 있지만 아직까지 멋진 점이 부족합니다. 이러한 효과에 대해서는 다음 섹션에서 논의하겠습니다.

더 많은 관련 기사를 보려면 PHP 중국어 웹사이트(www.php.cn)를 주목하세요!


관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 추천
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿