Jquery의 Ajax 구문 예제 요약

伊谢尔伦
풀어 주다: 2017-06-16 10:32:02
원래의
1696명이 탐색했습니다.

A v Java 소프트웨어 개발 과정에서 백그라운드에서 SSH와 같은 다양한 프레임워크를 통해 코드를 캡슐화하여 struts, SpringMVC와 같은 Java 코드 작성을 용이하게 할 수 있습니다. 작업 프로세스는 캡슐화되고 제어되므로 이를 달성하기 위해 몇 가지 간단한 구성만 하면 됩니다. Spring은 다양한 개체의 관리를 캡슐화하고 AOP 프로그래밍을 제공하므로 최대 절전 모드 및 IBatis 캡슐화 JDBC 코드는 다음을 수행할 필요가 없습니다. 매번 반복적이고 복잡한 JDBC 코드를 작성합니다. 프론트 데스크는 일부 효과, 검증 등을 JavaScript 언어를 통해 수행하지만 이는 프론트 엔드 코드 작성을 용이하게 하기 위해 js 코드를 캡슐화하고 있으며 브라우저 호환성 문제를 해결하는 데 매우 큰 이점이 있으며 이는 우리가 브라우저를 사용하는 매우 중요한 이유 중 하나입니다. ㅋㅋ                  Ajax(

Asynchronous Javascript + XML) 비동기 새로 고침은 비교할 수 없는 역할을 합니다. 과거에는 Ajax 작업을 작성하려면 항상 JDBC 코드와 같은 몇 가지 필수 단계를 수행해야 했습니다. 단계:

AJAX - 핵심 XMLHttpRequest 객체 , JQuery는 Ajax 비동기 작업도 캡슐화합니다. 다음은 몇 가지 일반적인 방법입니다. $.post, $.ajax, $.get, $.getJSON.

1. $.post, 이 함수는 실제로 $.ajax를 추가로 캡슐화하여 매개변수를 줄이고 작업을 단순화하지만 적용 범위는 더 작습니다. $.post는 데이터 제출 방법을 단순화하고 POST를 통해서만 제출할 수 있습니다. 서버에는 동기식이 아닌 비동기식으로만 접근할 수 있으며, 오류 처리를 수행할 수 없습니다. 이러한 상황에서는 이 기능을 사용하여 프로그래밍을 용이하게 할 수 있으며, 메서드, 비동기 등과 같은 주요 매개변수는 기본적으로 설정되어 있으며 변경할 수 없습니다. 예시는 다시 소개하지 않겠습니다.

url: 요청 주소를 보냅니다.

data: 전송할 키/값 매개변수입니다.

콜백: 전송 성공 시 콜백 함수입니다.

Jquery의 Ajax 구문 예제 요약type: 콘텐츠 형식, xml, html, script, json, text,_default를 반환합니다.

두 번째, $.ajax는 JQuery가 ajax를 캡슐화하는 가장 기본적인 단계입니다. 이 기능을 사용하면 비동기 통신의 모든 기능을 완료할 수 있습니다. 즉, 이 방법을 사용하여 어떤 상황에서도 비동기 새로 고침 작업을 수행할 수 있습니다. 하지만 매개변수가 너무 많아 때로는 약간 문제가 될 수도 있습니다. 일반적으로 사용되는 매개변수를 살펴보세요.                                                     도로 강도 제출

async // 여부 비동기 새로 고침 지원, 기본값은 true

데이터 //제출해야 하는 데이터

dataType //유형 xml, String, Json 등 서버에서 반환한 데이터

성공 //요청 성공 후 콜백 함수

오류 //요청 실패 후 콜백 함수

}

$.ajax(configObj);//$.ajax 함수를 통해 호출됩니다.

좋아요, 실제적인 예를 살펴보겠습니다. 비동기 삭제의 예를 살펴보겠습니다.

[javascript]

"font-size:18px; "> 유형:

"POST"

, //제출 방법 URL: $ "$ {PageContext.Request.ContextPath} /org/dodelete.action"

  • ,

    // 경로 데이터: {

  • " : "${org.id}"

  • ㅋㅋ            성공:

    function(결과) { //반환된 데이터는 결과에 따라 처리됩니다.

  •                                 $(

    "#tipMsg").text("데이터 삭제 성공적으로 “);

  •                                                             >ㅋㅋ $.post와 마찬가지로 이 함수는 get 메소드의 제출된 데이터를 캡슐화하며 get 제출된 데이터의 비동기 새로 고침을 해결하는 데만 사용할 수 있습니다. 사용 방법은 위와 유사합니다. 여기서는 더 이상 데모를 하지 않습니다.

  •                                                         $.getJSON, 이는 추가 캡슐화입니다. 즉, Json의 반환 데이터 유형에서 작동합니다. 우리가 설정해야 하는 매개변수는 url, [data], [callback] 세 개뿐입니다. 매우 간단합니다.

  • 실제로 $.ajax 방법을 알고 나면 다른 모든 방법을 사용할 수 있습니다. 실제로는 매우 간단합니다.

    그런데 여기에 더 문제가 되는 또 다른 문제가 있습니다. 즉, 페이지의 데이터 양이 상대적으로 많은 경우 어떻게 해야 할까요? 정규 형식을 처리할 때 Struts2 프레임워크를 사용하여 도메인 중심 모드를 통해 자동으로 캡슐화합니다. 그러면 Ajax를 통해 캡슐화하는 방법은 무엇입니까? 여기서 JQuery에는 Jquery Form이라는 플러그인이 있습니다. 이 js 파일을 도입하면 양식 양식을 모방하여 Struts2의 도메인 기반 모드를 지원하고 자동 데이터 캡슐화를 수행할 수 있습니다. 사용법은 $.ajax와 유사합니다. 실제 예를 살펴보겠습니다. 다음은 사용자를 저장하는 프런트엔드 코드입니다. "
  • >
  • function

    () {//실행해야 할 기능을 처리합니다. 전에

  • ㅋㅋ ~ "disabled"
  • ,

    true) {//성공 후 필요한 콜백 함수 반환

  • if ( 결과. 성공 ) {                                          

  •                             |
  • 나무 = window.parent.treeFrame .tree;

    ㅋㅋ ~ ~

  •                                                                      버튼

  •                                        ).attr( "비활성화됨", false

    );
  • },

  • clearForm:

    true  

  •       ~ ~                                      $('#orgForm').ajaxForm (옵션); //Jquery.Form의 ajaxForm 메소드를 통해 제출                   

  • 이렇게 하면 더 이상 데이터를 캡슐화할 필요가 없으므로 Ajax 작업과 비동기 새로 고침 작업이 크게 단순화됩니다. 정리하자면, JQuery에서 ajax 연산을 많이 사용하는 것 같습니다. 여전히 폼 처리와 매우 유사하지만 구현되는 기능이 다릅니다. 프로그래밍을 배우는 것은 실제로 데이터를 전송하고 처리하는 방법, 프론트 데스크에서 데이터를 가져와 해당 처리를 위해 서버로 전송한 다음 해당 디스플레이에 반환하는 방법을 배우는 것입니다. 소프트웨어가 완성되었습니다. 여전히 매우 흥미로운 느낌입니다.


    위 내용은 Jquery의 Ajax 구문 예제 요약의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

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