详解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+ajaxform+springboot控件实现数据更新功能
Jan 22 jQuery
jQuery实现判断上传图片类型和大小的方法示例
Apr 11 jQuery
jQuery实现的手动拖动控制进度条效果示例【测试可用】
Apr 18 jQuery
[原创]jquery判断元素内容是否为空的方法
May 04 jQuery
jQuery使用动画队列自定义动画操作示例
Jun 16 jQuery
基于jQuery ztree实现表格风格的树状结构
Aug 31 jQuery
jquery实现二级导航下拉菜单效果实例
May 14 jQuery
jquery树形插件zTree高级使用详解
Aug 16 jQuery
jQuery实现提交表单时不提交隐藏div中input的方法
Oct 08 jQuery
jquery validate 实现动态增加/删除验证规则操作示例
Oct 28 jQuery
jQuery--遍历操作实例小结【后代、同胞及过滤】
May 22 jQuery
jquery实现简单自动轮播图效果
Jul 29 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判断一个gif图片是否为动态图片的方法
2014/11/19 PHP
PHP实现HTML页面静态化的方法
2015/11/04 PHP
php验证码的制作思路和实现方法
2015/11/12 PHP
Laravel学习教程之本地化模块
2017/08/18 PHP
PHP实现可精确验证身份证号码的工具类示例
2018/05/31 PHP
css把超出的部分显示为省略号的方法兼容火狐
2008/07/23 Javascript
js电信网通双线自动选择技巧
2008/11/18 Javascript
菜鸟学习JavaScript小实验之函数引用
2010/11/17 Javascript
window.open关于浏览器拦截问题分析及解决方法
2013/02/05 Javascript
javascript按位非运算符的使用方法
2013/11/14 Javascript
JS判断字符串长度的5个方法(区分中文和英文)
2014/03/18 Javascript
JS中创建函数的三种方式及区别
2016/03/13 Javascript
jquery pagination插件动态分页实例(Bootstrap分页)
2016/12/23 Javascript
JavaScript30 一个月纯 JS 挑战中文指南(英文全集)
2017/07/23 Javascript
JavaScript面向对象精要(下部)
2017/09/12 Javascript
Vue中添加手机验证码组件功能操作方法
2017/12/07 Javascript
微信小程序版翻牌小游戏
2018/01/26 Javascript
JS实现的对象去重功能示例
2019/06/04 Javascript
Python 不同对象比较大小示例探讨
2014/08/21 Python
对numpy中的数组条件筛选功能详解
2018/07/02 Python
pycharm远程linux开发和调试代码的方法
2018/07/17 Python
numpy 计算两个数组重复程度的方法
2018/11/07 Python
解决Python2.7中IDLE启动没有反应的问题
2018/11/30 Python
HTML5 Canvas阴影使用方法实例演示
2013/08/02 HTML / CSS
全球立体声:World Wide Stereo
2018/09/29 全球购物
Dr. Martens马汀博士法国官网:马丁靴鼻祖
2020/01/15 全球购物
财务人员个人求职信范文
2013/12/04 职场文书
环保小标语
2014/06/13 职场文书
解除劳动合同证明书模板
2014/11/20 职场文书
2015年学校后勤工作总结
2015/04/08 职场文书
幼儿园教师个人工作总结2015
2015/05/12 职场文书
2015年数学教师工作总结
2015/05/20 职场文书
2015年大学宣传部工作总结
2015/05/26 职场文书
教你快速构建一个基于nginx的web集群项目
2021/11/27 Servers
Golang使用Panic与Recover进行错误捕获
2022/03/22 Golang
Redis实现订单过期删除的方法步骤
2022/06/05 Redis