详解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使用JSONP实现跨域获取数据的三种方法详解
May 04 jQuery
jQuery遍历节点方法汇总(推荐)
May 13 jQuery
Jquery+Ajax+xml实现中国地区选择三级联动菜单效果(推荐)
Jun 09 jQuery
jQuery Validate格式验证功能实例代码(包括重名验证)
Jul 18 jQuery
基于jQuery选择器之表单对象属性筛选选择器的实例
Sep 19 jQuery
jQuery实现表单动态加减、ajax表单提交功能
Jun 08 jQuery
解决jquery有正确返回值但不执行success函数的问题
Aug 20 jQuery
jQuery移动端跑马灯抽奖特效升级版(抽奖概率固定)实现方法
Jan 18 jQuery
使用jQuery如何写一个含验证码的登录界面
May 13 jQuery
jQuery中使用validate插件校验表单功能
May 24 jQuery
基于jquery实现的tab选项卡功能示例【附源码下载】
Jun 10 jQuery
jQuery实现二级导航菜单的示例
Sep 30 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切割页面div内容的实现代码分享
2012/07/31 PHP
php内嵌函数用法实例
2015/03/20 PHP
PHP+Ajax实现无刷新分页实例详解(附demo源码下载)
2016/04/07 PHP
谈谈PHP连接Access数据库的注意事项
2016/08/12 PHP
PHP实现负载均衡的加权轮询方法分析
2018/08/22 PHP
PHP抽象类与接口的区别实例详解
2019/05/09 PHP
PHP面向对象程序设计中的self、static、parent关键字用法分析
2019/08/14 PHP
node.js实现逐行读取文件内容的代码
2014/06/27 Javascript
简单分析javascript面向对象与原型
2015/05/21 Javascript
js实现文字垂直滚动和鼠标悬停效果
2015/12/31 Javascript
Bootstrap Table从服务器加载数据进行显示的实现方法
2016/09/29 Javascript
localStorage的黑科技-js和css缓存机制
2017/02/06 Javascript
基于Bootstrap table组件实现多层表头的实例代码
2017/09/07 Javascript
使用InstantClick.js让页面提前加载200ms
2017/09/12 Javascript
Nodejs中crypto模块的安全知识讲解
2018/01/03 NodeJs
webpack里使用jquery.mCustomScrollbar插件的方法
2018/05/30 jQuery
Vue组件创建和传值的方法
2018/08/17 Javascript
基于axios 解决跨域cookie丢失的问题
2018/09/26 Javascript
JS回调函数原理与用法详解【附PHP回调函数】
2019/07/20 Javascript
微信小程序 textarea 层级过高问题简单解决方案
2019/10/14 Javascript
关于JS模块化的知识点分享
2019/10/16 Javascript
Python字符串和文件操作常用函数分析
2015/04/08 Python
Python wxPython库消息对话框MessageDialog用法示例
2018/09/03 Python
python实现zabbix发送短信脚本
2018/09/17 Python
python读取xlsx的方法
2018/12/25 Python
python做反被爬保护的方法
2019/07/01 Python
利用Python实现Json序列化库的方法步骤
2020/09/09 Python
HTML5移动端开发中的Viewport标签及相关CSS用法解析
2016/04/15 HTML / CSS
金牌葡萄酒俱乐部:Gold Medal Wine Club
2017/11/02 全球购物
数控技术应届生求职信
2013/11/13 职场文书
工厂保洁员岗位职责
2013/12/04 职场文书
怎样写演讲稿
2014/01/04 职场文书
生物科学专业毕业生求职信
2014/06/02 职场文书
自动化专业毕业生求职信
2014/06/18 职场文书
vue前端工程的搭建
2021/03/31 Vue.js
Python基础之函数嵌套知识总结
2021/05/23 Python