详解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使用eraser.js插件实现擦除、刮刮卡效果的方法【附eraser.js下载】
Apr 28 jQuery
jQuery实现拖动效果的实例代码
Jun 25 jQuery
jQuery 实现图片的依次加载图片功能
Jul 06 jQuery
jQuery实现的简单无刷新评论功能示例
Nov 08 jQuery
jQuery EasyUI window窗口使用实例代码
Dec 25 jQuery
jquery3和layui冲突导致使用layui.layer.full弹出全屏iframe窗口时高度152px问题
May 12 jQuery
jQuery+ajax实现批量删除功能完整示例
Jun 06 jQuery
jquery实现自定义树形表格的方法【自定义树形结构table】
Jul 12 jQuery
javascript/jquery实现点击触发事件的方法分析
Nov 11 jQuery
jquery实现垂直手风琴导航栏
Feb 18 jQuery
jQuery实现查看图片功能
Dec 01 jQuery
jQuery实现可以扩展的日历
Dec 01 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
星际争霸中的热键
2020/03/04 星际争霸
在服务端进行目录建立、删除,文件上传、删除的过程的php代码
2008/09/10 PHP
php下HTTP Response中的Chunked编码实现方法
2008/11/19 PHP
PHP里的中文变量说明
2011/07/23 PHP
PHP实现基于PDO扩展连接PostgreSQL对象关系数据库示例
2018/03/31 PHP
phpQuery采集网页实现代码实例
2020/04/02 PHP
PHP 实现 JSON 数据的编码和解码操作详解
2020/04/22 PHP
PHP如何通过date() 函数格式化显示时间
2020/11/13 PHP
js 获取中文拼音,Select自动匹配字母获取值的代码
2009/09/23 Javascript
JS对外部文件的加载及对IFRMAME的加载的实现,当加载完成后,指定指向方法(方法回调)
2011/07/04 Javascript
仿百度输入框智能提示的js代码
2013/08/22 Javascript
javascript修改图片src的方法
2015/01/27 Javascript
Javascript中的Callback方法浅析
2015/03/15 Javascript
跟我学习javascript的异步脚本加载
2015/11/20 Javascript
Bootstrap Metronic完全响应式管理模板之菜单栏学习笔记
2016/07/08 Javascript
微信小程序 label 组件详解及简单实例
2017/01/10 Javascript
React中使用async validator进行表单验证的实例代码
2018/08/17 Javascript
Vue实现用户自定义字段显示数据的方法
2018/08/28 Javascript
VSCode使用之Vue工程配置eslint
2019/04/30 Javascript
js实现选项卡效果
2020/03/07 Javascript
鸿蒙系统中的 JS 开发框架
2020/09/18 Javascript
Node.js path模块,获取文件后缀名操作
2020/11/07 Javascript
[51:26]DOTA2上海特级锦标赛主赛事日 - 2 胜者组第一轮#3Secret VS OG第二局
2016/03/03 DOTA
举例讲解如何在Python编程中进行迭代和遍历
2016/01/19 Python
教大家使用Python SqlAlchemy
2016/02/12 Python
尝试用最短的Python代码来实现服务器和代理服务器
2016/06/23 Python
Python中判断输入是否为数字的实现代码
2018/05/26 Python
pycharm内无法import已安装的模块问题解决
2020/02/12 Python
Python grpc超时机制代码示例
2020/09/14 Python
Python如何批量生成和调用变量
2020/11/21 Python
调用HTML5的Canvas API绘制图形的快速入门指南
2016/06/17 HTML / CSS
Speedo美国:澳大利亚顶尖泳衣制造商
2016/08/03 全球购物
鞋子女王塔玛拉·梅隆同名奢侈品牌:Tamara Mellon
2017/11/22 全球购物
优良学风班申请材料
2014/02/13 职场文书
无刑事犯罪记录证明范本
2014/09/29 职场文书
科技活动总结范文
2015/05/11 职场文书