SpringMVCフレームの下で、ajax非同期(asynchronous)要求をjQueryで送ります.

一、プロジェクトの中でjQuery jQuery公式CDNを引用するにはどうすればいいですか?

<span style="font-size:14px;"><script type="text/javascript" src="http://code.jquery.com/jquery-1.12.0.min.js"></script>
<script type="text/javascript" src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script></span>

Google CDN(Googleのサイトは大陸でのアクセスが制限されていますので、ロード速度に影響があります.)

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>  
<script type="text/javascript" src="http://jquery-json.googlecode.com/files/jquery.json-2.2.min.js"></script>  

二、ajax要求を送ります.簡単なdemoです.もうテストに合格しました.JavaScriptコードです.

//  jQuery + Ajax + SpringMVC 
$(function(){
    //       
    $("#input_url").click(
        function(){
            //
            var $a = $(this);
            //  ajax  
            $.ajax({
                //
                url:"AjaxAsynchronousRequestTest.action",
                type:'post',
                data:'name=admin',
                dataType:'json',
                success:function(data,status){
                    if(status == "success"){
                    
                        //           
                        var str_from_server = data.message;

                        //             
                        $("#response_div").html(str_from_server);
                    }
                },
                //
                error:function(xhr,textStatus,errorThrown){}
            }
            );
        }
    );
}
);

2,htmlコード

<!-- Ajax Asynchronous request test -->

<div id="container">   
	<table class="zebra">
		<thead>
        	<tr>
				<th>Ajax Asynchronous request test</th>
                </tr>
		</thead>
        <tbody>
        	<tr>
            	    <td><input type="button" name="determine_url" id="input_url" value="    ajax       ，        "/></td>
                </tr>
        </tbody>
	</table>
</div>

<!-- Display the response body -->

<div id="response_div"></div>

3,サーバー端コードSprigMVCのController

<span style="font-size:14px;">/**
 *
 * @author ycq
 *
 * Ajax Asynchronous request test
 *
 */

@Controller
public class AjaxAsynchronousRequestTestController {
    
    @RequestMapping("AjaxAsynchronousRequestTest.action")
    @ResponseBody
    public Map<String,String> getBeanBySpringMethod(){
        
        //    Map，      
        Map<String,String> responseToAjax = new HashMap<String,String>();
        
        responseToAjax.put("message", "ajax        ...");
        
        responseToAjax.put("msg", "@ResponseBody");
        
        //    
        System.out.println("  ...，      ，  Ajax Asynchronous request     ...");
        
        return responseToAjax;
    }
}</span>

以下にもう一つのデモを添付します.

 function Ajax_demo(){
	 var ajaxUrl = '${ctx}/xxxcontroller/method_in_controller.html?ajax=true';
	 var ajaxData ="";
	 var iframeFlag = false;
		$.ajax({
			type:'POST',
			url:ajaxUrl,
			data:ajaxData,
			error:function(){
				alert('ajax  ');
				if(iframeFlag){
					$(".class_1").css("display","none");
				}else{
					$(".class_2").css("display","none");
				}
			},
			success:function(data){
				if($("#some_id").length > 0){
					$("#some_id").html(data);
				}
				
				$(".class_3").css("display","none");
				
			}
		});
	}