Jquery中的ajax学习

最新推荐文章于 2022-07-19 11:16:13 发布

fachew

最新推荐文章于 2022-07-19 11:16:13 发布

阅读量130

点赞数

分类专栏：笔记

本文链接：https://blog.csdn.net/fachew/article/details/97619007

版权

笔记专栏收录该内容

18 篇文章 0 订阅

订阅专栏

jquery是js的一个轻量型框架，已经将js创建的操作进行了封装，而ajax也是js的一部分，所以jquery也已经将ajax进行了封装
一、封装常用的方法
1. $.get(url,data,fn)
url:请求地址
data:请求参数，参数格式为json对象
fn：回调函数；注：回调函数需要声明一个形参，来接收响应数据
2. $.post(url,data,fn)
url:请求地址
data:请求参数，参数格式为json对象
fn：回调函数；注：回调函数需要声明一个形参，来接收响应数据
3. $ajax({josn格式的参数})
参数类型参照api

二、js代码

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>My JSP 'regJquery.jsp' starting page</title>
    <!-- 引入js文件 -->
    <script type="text/javascript" src="js/jquery-1.9.1(1).js"></script>
    <!-- 声明js代码域 -->
    <script type="text/javascript">
    //页面加载成功给HTML添加事件
    $(function(){
    	//给用户名文本框添加失去焦点事件
    	$("#uname").blur(function(){
    		//get请求方式
    		//发起ajax请求，检查用户名是否被注册
    		/*$.get("data",{uname:$("#uname").val()},function(data){
    			alert(data);
    	});	
    	//post请求方式
    		$.post("data",{uname:$("#uname").val()},function(data){
    			alert(data);
    		});*/
    		
    	//$.ajax方式
    		$.ajax({
    			type:"get",
    			url:"data",
    			data:"uname"+$("#uname").val(),
    			success:function(data){
    				alert(data);
    			}
    		})
    	})
    })
    
    </script>
  </head>
  
  <body>
  <h3>Jquery中的ajax学习</h3>
  <hr/>
    用户名：<input type="text" id="uname" value=""/>
  </body>
</html>

三、运行图

在这里插入图片描述

fachew

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Jquery中的ajax学习

jquery是js的一个轻量型框架，已经将js创建的操作进行了封装，而ajax也是js的一部分，所以jquery也已经将ajax进行了封装一、封装常用的方法1. $.get(url,data,fn)url:请求地址data:请求参数，参数格式为josn对象fn：回调函数；注：回调函数需要声明一个形参，来接收响应数据2. $.post(url,data,fn)url...
复制链接

扫一扫