详解jQuery中关于Ajax的几个常用的函数


Posted in jQuery onJuly 17, 2017

一:

AJAX 是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。

什么是 AJAX ?

AJAX = 异步 JavaScript 和 XML。

AJAX 是一种用于创建快速动态网页的技术。

通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。

传统的网页(不使用 AJAX)如果需要更新内容,必需重载整个网页面。

有很多使用 AJAX 的应用程序案例:新浪微博、Google 地图、开心网等等。

二:传统的Ajax过于繁琐,jquer封装了一些ajax常用的简单函数。

   a:  $.ajax()方法:

   jsp页面代码 :

<head>
  <title>Ajax验证</title>
  <script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>
  <script type="text/javascript">
    $(function () {
      $("[name='userName']").blur(function () {     
        $.ajax({
          type: "post",
          url: "/TestServlet",
          data:{action:"login"},     //data 传递的参数一般都是key:“ value” 类型的 value一定要加引号 我亲身体验 那种找不到错的感觉
          // dataType:'Text',      //servers 返回的格式 也可以是gjon
          success: function (data) {
            if (data == "success") {
              alert(data);
              $("#myspan").html(data);
            }
          },
          error: function () {      //这个用的比较少
          }
        })
      })
    })
  </script>
</head>
<body>
   姓名: <input name="userName" type="text"><span id="myspan"></span>
   密码: <input name="password" type="text">
</body>

     servlet后台代码:

public class TestServlet extends HttpServlet {
  protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    String name = request.getParameter("action");
    System.out.println(name);
    if(name.equals("login")){
      response.getWriter().write("success");  //返回回掉函数的参数
    }else{
      response.getWriter().write("file");
    }
  }

   b:$.get() , $.post()和 $.getJson方法都是$.ajax()方法的精简版,用法大致一致,少了一个type

$.post("/TestServlet",
         {"uname":$('[name=uname]').val()},
         function (data) {
           alert(data);
         });

   c: $.load()

$("#msg").load(     //可以直接拿到文本框 的值
         "/TestServlet","action="+$('[name="userName"]').val()
         );
//后台可以直接 根据request.getParameter()拿到参数的值

   d:$(selector).serializeArray() 和$(selector).serialize()  

//这种方法 可以直接 获得form表单的name属性值,作为data的传参
 var data1 = $("#form1").serializeArray(); //自动将form表单封装成json
           $.each(data1,function (i,dom) {
             alert(dom.name+"\r\n"+dom.value);
           });
           var data2=$("#form1").serialize();
           alert(data2);

   e:作为data参数

var data2=$("#form1").serialize();
           $.getJSON("/TestServlet",data2, function (data) {
              alert(data);
           });

以上所述是小编给大家介绍的jQuery中关于Ajax的几个常用的函数,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

jQuery 相关文章推荐
jQuery插件之validation插件
Mar 29 jQuery
jQuery.ajax向后台传递数组问题的解决方法
May 12 jQuery
jQuery简单绑定单个事件的方法示例
Jun 10 jQuery
jQuery实现返回顶部按钮和scroll滚动功能[带动画效果]
Jul 05 jQuery
jQuery实现的事件绑定功能基本示例
Oct 11 jQuery
jQuery常见的遍历DOM操作详解
Sep 05 jQuery
jQuery中each遍历的三种方法实例分析
Sep 07 jQuery
用jQuery将JavaScript对象转换为querystring查询字符串的方法
Nov 12 jQuery
jquery登录的异步验证操作示例
May 09 jQuery
基于jquery ajax的多文件上传进度条过程解析
Sep 11 jQuery
jQuery实现tab栏切换效果
Dec 22 jQuery
jQuery实现广告显示和隐藏动画
Jul 04 jQuery
jQuery常用选择器详解
Jul 17 #jQuery
jQuery Autocomplete简介_动力节点Java学院整理
Jul 17 #jQuery
jQuery Pagination分页插件_动力节点Java学院整理
Jul 17 #jQuery
jQuery Form插件使用详解_动力节点Java学院整理
Jul 17 #jQuery
jQuery列表检索功能实现代码
Jul 17 #jQuery
如何将 jQuery 从你的 Bootstrap 项目中移除(取而代之使用Vue.js)
Jul 17 #jQuery
用户管理的设计_jquery的ajax实现二级联动效果
Jul 13 #jQuery
You might like
PHP异常处理浅析
2015/05/12 PHP
thinkphp 抓取网站的内容并且保存到本地的实例详解
2017/08/25 PHP
详解PHP字符串替换str_replace()函数四种用法
2017/10/13 PHP
Js 获取当前日期时间及其它操作实现代码
2021/03/04 Javascript
js jquery验证银行卡号信息正则学习
2013/01/21 Javascript
JavaScript实现自动弹出窗口并自动关闭窗口的方法
2015/08/06 Javascript
js实现的简单radio背景颜色选择器代码
2015/08/18 Javascript
浅谈Javascript中Object与Function对象
2015/09/26 Javascript
jQuery position() 函数详解以及jQuery中position函数的应用
2015/12/14 Javascript
Node.js的环境安装配置(使用nvm方式)
2016/10/11 Javascript
基于VUE.JS的移动端框架Mint UI的使用
2017/10/11 Javascript
layui 设置table 行的高度方法
2018/08/17 Javascript
详解JS实现简单的时分秒倒计时代码
2019/04/25 Javascript
Python 除法小技巧
2008/09/06 Python
使用python实现拉钩网上的FizzBuzzWhizz问题示例
2014/05/05 Python
Python中使用bidict模块双向字典结构的奇技淫巧
2016/07/12 Python
python中logging库的使用总结
2017/10/18 Python
python中的二维列表实例详解
2018/06/19 Python
Python使用numpy产生正态分布随机数的向量或矩阵操作示例
2018/08/22 Python
Python 多维List创建的问题小结
2019/01/18 Python
python xlwt如何设置单元格的自定义背景颜色
2019/09/03 Python
python 申请内存空间,用于创建多维数组的实例
2019/12/02 Python
40个你可能不知道的Python技巧附代码
2020/01/29 Python
Pandas时间序列基础详解(转换,索引,切片)
2020/02/26 Python
浅谈Python的方法解析顺序(MRO)
2020/03/05 Python
美国复古街头服饰精品店:Need Supply Co.
2017/02/22 全球购物
Does C# support multiple inheritance? (C#支持多重继承吗)
2012/01/04 面试题
大家检讨书5000字
2014/02/03 职场文书
药品业务员岗位职责
2014/04/17 职场文书
公司担保书范文
2014/05/21 职场文书
作文批改评语
2014/12/25 职场文书
应聘教师求职信范文
2015/03/20 职场文书
留学推荐信怎么写
2015/03/26 职场文书
2016年校长新年寄语
2015/08/17 职场文书
css filter和getUserMedia的联合使用
2022/02/24 HTML / CSS
PyTorch中的torch.cat简单介绍
2022/03/17 Python