Ajax 비동기 제출 폼 데이터 설명 및 방법 인 스 턴 스

장면 설명:로그 인 페이지 에 로그 인 폼 이 있 지만 로그 인 검증 논리 가 복잡 하기 때문에 로그 인 을 클릭 한 후에 현재 페이지 를 새로 고치 지 않 고 로그 인 결 과 를 제시 한 후에 새로운 페이지 로 건 너 갈 지,사용자 이름 비밀번호 오 류 를 알려 줄 지 선택 하고 싶 습 니 다.이와 같은 문 제 는 매우 많다.비동기 적 으로 데 이 터 를 얻 으 면 사용자 체험 이 크게 향상 된다.배경 지식:Ajax 는 비동기 JavaScript 및 XML(Asynchronous JavaScript And XML)을 말 합 니 다.AJAX 는 새로운 프로 그래 밍 언어 가 아니 라 더 빠 르 고 상호작용 이 강 한 것 을 만 드 는 데 사용 된다. 웹 응용 프로그램의 기술.AJAX 를 통 해 자바 스 크 립 트 의 XML HttpRequest 대상 을 사용 하여 서버 와 직접 통신 할 수 있 습 니 다.이 대상 을 통 해 자바 스 크 립 트 는 페이지 를 다시 불 러 오지 않 은 상태 에서 웹 서버 와 데 이 터 를 교환 할 수 있 습 니 다.AJAX 브 라 우 저 와 웹 서버 사이 에 비동기 데이터 전송(HTTP 요청)을 사용 하면 웹 페이지 가 전체 페이지 가 아 닌 서버 에서 소량의 정 보 를 요청 할 수 있 습 니 다.AJAX 는 인터넷 응용 프로그램 을 더욱 작고 빠 르 며 우호 적 으로 만 들 수 있다.AJAX 웹 서버 소프트웨어 에 독립 된 브 라 우 저 기술 입 니 다.AJAX 는 다음 웹 표준 을 기반 으로 합 니 다.JavaScript XML HTML CSS 가 AJAX 에서 사용 하 는 웹 표준 은 잘 정의 되 었 고 모든 주류 브 라 우 저 에 의 해 지원 되 었 습 니 다.AJAX 응용 프로그램 은 브 라 우 저 와 플랫폼 에 독립 되 어 있 습 니 다.Web 응용 프로그램 은 데스크 톱 응용 프로그램 보다 많은 장점 을 가지 고 있 습 니 다.그들 은 많은 사용자 와 관련 될 수 있 고 설치 와 유지 가 쉬 우 며 개발 도 쉽다.그러나 인터넷 프로그램 은 전통 적 인 데스크 톱 프로그램 처럼 완벽 하고 우호 적 이지 않다. AJAX 를 통 해 인터넷 애플 리 케 이 션 은 더욱 완벽 하고 우호 적 으로 변 할 수 있다.구체 적 인 용법:

<script type="text/javascript"> 
(function(){ 
    jQuery('#loginForm').click( 
        function() { 
            jQuery('#tips').html("    ....."); 
            jQuery.post( 
                <span style="white-space:pre">      </span>'login.action', 
                <span style="white-space:pre">      </span>{ 
                   <span style="white-space:pre">           </span>"username":jQuery('#username').val(), 
                   <span style="white-space:pre">           </span>"password":jQuery('#password').val() 
                <span style="white-space:pre">      </span>}, 
                <span style="white-space:pre">      </span>function(result) { 
                    jQuery('#tips').html(result); 
                <span style="white-space:pre">      </span>}, 
                <span style="white-space:pre">      </span>"json" 
             <span style="white-space:pre">     </span>); 
        } 
    ); 
})(); 
</script> 

post 방법 에는 네 개의 인자 가 있다.첫 번 째 는 url 주소 입 니 다.struts 2 에서 저 희 는 해당 하 는 action 에 만 제출 하거나 방법 을 지정 합 니 다.웹 x 에 대해 서 는 url 주소 login.htm?action=user 를 이렇게 써 야 합 니 다.login&event_submit_do_user_login=any 두 번 째 는 매개 변수 목록 입 니 다.제출 할 데 이 터 는 키 값 으로 제출 합 니 다.세 번 째 매개 변 수 는 결과 처리 함수 입 니 다.결 과 는 result 에서 꺼 냅 니 다.네 번 째 매개 변 수 는 데이터 반환 형식 입 니 다.그러면 action 이나 screen 에서 해 야 할 처 리 는:

 
HttpServletResponse response = rundata.getResponse(); 
response.setContentType("application/json"); 
PrintWriter out; 
try { 
    out = response.getWriter(); 
    String result = (String) context.get("result"); 
    JSONObject json = new JSONObject(); 
    json.put("result", result); 
    out.print(json); 
    out.flush(); 
} catch (IOException e) { 
    e.printStackTrace(); 
} 

처리 결 과 를 입력 하면 됩 니 다.