zoukankan      html  css  js  c++  java
  • jQuery ajax()方法

    $.ajax()方法:

      


    * 发送data主要有3种方式
    * 1.json 数组(推荐1)
    * 2.url拼接
    * 3.表单的序列化serialize(推荐2)

    (1)json 数组(推荐1)

    $(function(){
        var myClick = function(){
        var userName = $().val();
        var myDate = {userName:usrName};
        var myFunction = function(result){alert(result)};
        var eeorFunction = function(){alert("发生异常")};
        
        $.ajax({
              url:'B',//目标为Servlet B发送请求地址
              type:'GET',/*访问Servlet B请求方式(post或get)默认为get。注意其他http请求方法,例如put和delete也可以使用,但仅部分浏览器支持。*/
              date:myDate,//把信息提交给Servlet数据
              dateType:'text',//返回类型为文本类型
             success:myFunction,//成功后的回调函数,result为服务器返回的内容
             error:errorFunction,
             timeout:2000

          /*
            $.ajax()以上7个方法都是常用方法。
          */ }); } $("#img").click(myClick); });
    <body> <form>   <input id="userName" name="userName"value="xiaoming"><br>   <img id="img" src="img/1.png">   </form> </body>

    (2)url拼接

    $(function(){
        var myClick = function(){
        var userName = $().val();
        var myDate = {userName:usrName};
        var myFunction = function(result){alert(result)};
    /*var eeorFunction = function(){alert("发生异常")};*/

        var errorFunction = function(XMLHttpRequest,textStatus){
        //alert('发生错误');
        if (XMLHttpRequest.status==404){
        alert('找不到服务器[404]');
        } else if(XMLHttpRequest.status==500){
        alert('服务器忙,请稍后再试[500]');
        }else{
        alert('服务器错误['+XMLHttpRequest.status+']');
        }

       } 
        $.ajax({
              url:'B?userName='+$("#userName").val(),//目标为Servlet B发送请求地址
    type:'GET',/*访问Servlet B请求方式(post或get)默认为get。注意其他http请求方法,例如put和delete也可以使用,但仅部分浏览器支持。*/ date:myDate,//把信息提交给Servlet数据 dateType:'text',//返回类型为文本类型   success:myFunction,//成功后的回调函数,result为服务器返回的内容   error:errorFunction,   timeout:2000 }); } $("#img").click(myClick); });
    <body> <form>   <input id="userName" name="userName"value="xiaoming"><br>   <img id="img" src="img/1.png">   </form> </body>

    (3) 表单的序列化serialize(推荐2)

    $(function(){

        var kk = $("#userName").serialize();
        var tt = $("#frm1").serialize();
        //alert(t    //var myClick = function    //var userName = $().val();

      //var myDate = {userName:usrName};
        

    var myFunction = function(result){alert(result)};
    /*var eeorFunction = function(){alert("发生异常")};*/    var errorFunction = function(XMLHttpRequest,textStatus){     //alert('发生错误');     if (XMLHttpRequest.status==404){     alert('找不到服务器[404]');     } else if(XMLHttpRequest.status==500){     alert('服务器忙,请稍后再试[500]');     }else{     alert('服务器错误['+XMLHttpRequest.status+']');     }    }  $.ajax({ url:'B?userName='+$("#userName").val(),//目标为Servlet B发送请求地址 type:'GET',/*访问Servlet B请求方式(post或get)默认为get。注意其他http请求方法,例如put和delete也可以使用,但仅部分浏览器支持。*/ date:myDate,//把信息提交给Servlet数据 dateType:'text',//返回类型为文本类型   success:myFunction,//成功后的回调函数,result为服务器返回的内容   error:errorFunction,   timeout:2000 }); } $("#img").click(myClick); }); <body> <form>   <input id="userName" name="userName"value="xiaoming"><br>
        <input id="sex" name="sex" value="男"><br>
        <img id="img" src="img/1.png">
      </form> </body>
  • 相关阅读:
    WPF 使用 Direct2D1 画图 绘制基本图形
    WPF 使用 Direct2D1 画图 绘制基本图形
    dot net core 使用 IPC 进程通信
    dot net core 使用 IPC 进程通信
    win2d 图片水印
    win2d 图片水印
    Java实现 LeetCode 240 搜索二维矩阵 II(二)
    PHP closedir() 函数
    PHP chroot() 函数
    PHP chdir() 函数
  • 原文地址:https://www.cnblogs.com/wangpengpeng/p/7234356.html
Copyright © 2011-2022 走看看