返回顶部

AJAX概念及作用。 JQuery中关于AJAX的几个常用的函数

1.ajax是什么？作用是什么？

ajax是一种无需再重新加载整个网页的情况下，能够更新部分网页的技术，那什么是ajax呢？ 

 

AJAX = Asynchronous JavaScript and XML（异步的 JavaScript 和 XML）。

AJAX 不是新的编程语言，而是一种使用现有标准的新方法。

AJAX 是与服务器交换数据并更新部分网页的艺术，在不重新加载整个页面的情况下。是一种用于快速创建动态网页的技术。通过在后台于服务器进行少量的数据交换，AJAX可以实现网页异步的更新

传统的网页（不适用ajax）如果内容需要更新的话，必须重载政哥哥网页面。

 

2.JQuery的一些常用的针对ajax的函数

 　　（1） $.ajax(

　　　　　　　　　　type:   ,

　　　　　　　　　　url:     ,

　　　　　　　　　　data:    ,

　　　　　　　　　　success:function(data){

　　　　　　　　　　　　　　........

　　　　　　　　　　　　　　　　},

　　　　　　　　　　error:function(){

　　　　　　　　　　　　........}

这个是比较复杂的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");
    }
  }
复制代码

（2）$.post()

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

详解：

jquery中$.post()方法的简单实例

在jqery中有这样一个方法，$.post()下面就这个方法做一个简单的实例：

jQuery.post( url, [data], [callback], [type] ) ：使用POST方式来进行异步请求

参数：

url (String) : 发送请求的URL地址.

data (Map) : (可选) 要发送给服务器的数据，以 Key/value 的键值对形式表示。

callback (Function) : (可选) 载入成功时回调函数(只有当Response的返回状态是success才是调用该方法)。

type (String) : (可选)官方的说明是：Type of data to be sent。其实应该为客户端请求的类型(JSON,XML,等等)

$.load():

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

 

posted @   fen斗  阅读(914)  评论(0)  编辑  收藏  举报
编辑推荐：
· AI与.NET技术实操系列：向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列：如何用heaptrack跟踪.NET程序的非托管内存泄露
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
阅读排行：
· winform 绘制太阳，地球，月球 运作规律
· AI与.NET技术实操系列（五）：向量存储与相似性搜索在 .NET 中的实现
· 超详细：普通电脑也行Windows部署deepseek R1训练数据并当服务器共享给他人
· 【硬核科普】Trae如何「偷看」你的代码？零基础破解AI编程运行原理
· 上周热点回顾（3.3-3.9）
点击右上角即可分享
微信分享提示
AI IDE Trae