详解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实现的Ajax 验证用户名唯一性实例代码
Jun 28 jQuery
jQuery Pagination分页插件_动力节点Java学院整理
Jul 17 jQuery
自定义类似于jQuery UI Selectable 的Vue指令v-selectable
Aug 23 jQuery
jQuery实现注册会员时密码强度提示信息功能示例
Sep 05 jQuery
jQuery实现简单的回到顶部totop功能示例
Oct 16 jQuery
jQuery实现弹窗下底部页面禁止滑动效果
Dec 19 jQuery
jQuery动态生成的元素绑定事件操作实例分析
May 04 jQuery
JQuery+Bootstrap 自定义全屏Loading插件的示例demo
Jul 03 jQuery
Jquery Datatables的使用详解
Jan 30 jQuery
jQuery实现的分页插件完整示例
May 26 jQuery
Jquery Fade用法详解
Nov 06 jQuery
Jquery+javascript实现支付网页数字键盘
Dec 21 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
Discuz! 5.0.0论坛程序中加入一段js代码,让会员点击下载附件前自动弹出提示窗口
2007/04/18 PHP
PHP的error_reporting错误级别变量对照表
2014/07/08 PHP
在PHP站点的页面上添加Facebook评论插件的实例教程
2016/01/08 PHP
js正则表达exec与match的区别说明
2014/01/29 Javascript
jquery果冻抖动效果实现方法
2015/01/15 Javascript
JavaScript中常见的字符串操作函数及用法汇总
2015/05/04 Javascript
JavaScript基于原型链的继承
2016/06/22 Javascript
深入浅析JavaScript中的scrollTop
2016/07/11 Javascript
小程序开发实战:实现九宫格界面的导航的代码实现
2017/01/19 Javascript
关于jQuery里prev()的简单操作代码
2017/10/27 jQuery
jQuery实现点击旋转,再点击恢复初始状态动画效果示例
2018/12/11 jQuery
js取0-9随机取4个数不重复的数字代码实例
2019/03/27 Javascript
JS+CSS3实现的简易钟表效果示例
2019/04/13 Javascript
Vue表单控件数据绑定方法详解
2020/02/05 Javascript
js中!和!!的区别与用法
2020/05/09 Javascript
[02:07]2018DOTA2亚洲邀请赛主赛事第三日五佳镜头 fy极限反杀
2018/04/06 DOTA
[58:54]EG vs RNG 2019国际邀请赛小组赛 BO2 第一场 8.16
2019/08/18 DOTA
使用Python的Scrapy框架十分钟爬取美女图
2016/12/26 Python
Pycharm学习教程(1) 定制外观
2017/05/02 Python
Python实现将蓝底照片转化为白底照片功能完整实例
2019/12/13 Python
浅谈keras中的目标函数和优化函数MSE用法
2020/06/10 Python
Python classmethod装饰器原理及用法解析
2020/10/17 Python
4款Python 类型检查工具,你选择哪个呢?
2020/10/30 Python
AmazeUI 输入框组的示例代码
2020/08/14 HTML / CSS
Bose美国官网:购买Bose耳机和音箱
2019/03/10 全球购物
英国川宁茶官方网站:Twinings茶
2019/05/21 全球购物
英国领先的在线礼品店:Getting Personal
2019/09/24 全球购物
国贸专业个人求职信分享
2013/12/04 职场文书
初三化学教学反思
2014/01/23 职场文书
请假条标准格式规范
2014/04/10 职场文书
经贸日语专业自荐信
2014/09/02 职场文书
论群众路线学习笔记
2014/11/06 职场文书
后勤工作个人总结
2015/02/28 职场文书
2015大学生党员自我评价范文
2015/03/03 职场文书
房地产财务经理岗位职责
2015/04/08 职场文书
严以律己专题学习研讨会发言材料
2015/11/09 职场文书