Jquery中的ajax应用(第九章PPT)
<%@ page language="java" import="java.util.*" pageEncoding="ISO-8859-1"%>
<%
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 'adjx.jsp' starting page</title> <meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<script type="text/javascript" src="js/jquery-3.3.1.js"></script>
<script type="text/javascript">
$(function(){
$("#submit").click(function(){
var param = {
name:$("#name").val(),
age:$("#age").val()
};
$.ajax({
data:param,
url:"oneServlet",
beforeSend:function(){
$("img").show();
},
complete:function(){
$("img").hide();
},
success:function(data){
alert(data);
},
error:function(XMLHttpRequest, textStatus, errorThrown){
alert(XMLHttpRequest.status+" "+textStatus+" "+errorThrown);
} }); });
});
</script>
</head> <body>
<form>
<table>
<tr><td>name:</td><td><input type="text" id="name" name="name"></td></tr>
<tr><td>age:</td><td><input type="text" id="age" name="age"></td></tr>
<tr><td><input type="button" value="submit" id="submit"></td></tr>
</table>
<img src="data:images/6.jpg">
</form>
</body>
</html>
servlet:
import java.io.IOException;
import java.io.PrintWriter; import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse; public class oneServlet extends HttpServlet { public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
String name = request.getParameter("name");
String age = request.getParameter("age");
response.setContentType("text/html");
PrintWriter out = response.getWriter();
out.print(name+":"+age); } public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
doGet(request, response);
} }
************************************************************************************************************************************************************************************************
Jquery中的ajax应用(第九章PPT)的更多相关文章
- 深入理解ajax系列第九篇——jQuery中的ajax
前面的话 jQuery提供了一些日常开发中需要的快捷操作,例如load.ajax.get和post等,使用jQuery开发ajax将变得极其简单.这样开发人员就可以将程序开发集中在业务和用户体验上,而 ...
- Jquery中的Ajax
AJAX: * jQuery中的Ajax * 封装第一层 - 类似于原生Ajax的用法 * $.ajax() - 最复杂 * 选项 * url - 请求地址 * type - 请求类型,默认为GET ...
- jQuery入门(4)jQuery中的Ajax应用
jQuery入门(1)jQuery中万能的选择器 jQuery入门(2)使用jQuery操作元素的属性与样式 jQuery入门(3)事件与事件对象 jQuery入门(4)jQuery中的Ajax()应 ...
- 【Java EE 学习 33 上】【JQuery样式操作】【JQuery中的Ajax操作】【JQuery中的XML操作】
一.JQuery中样式的操作 1.给id=mover的div采用属性增加样式.one $("#b1").click(function(){ $("#mover" ...
- jquery中的ajax参数
jquery中将ajax封装成了函数,我们使用起来非常方便,jquery会自动根据内容选择post还是get方式提交数据,并且会自动编码,但是要想完全掌握jquery中的ajax,我们必须将它的各个参 ...
- 用JQuery中的Ajax方法获取web service等后台程序中的方法
用JQuery中的Ajax方法获取web service等后台程序中的方法 1.准备需要被前台html页面调用的web Service,这里我们就用ws来代替了,代码如下: using System; ...
- jQuery中操作Ajax方法小结
有时候,越深入去了解一个点,越发觉得自己无知,而之前当自己晓得一两个片面的点还洋洋自得,殊不知,这是多么讽刺 jQery对Ajax操作进行了封装,常见的 ajax()属于最底层的方法,使用频率很高的 ...
- $.ajax()方法详解 jquery中的ajax方法
jquery中的ajax方法参数总是记不住,这里记录一下. 1.url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址. 2.type: 要求为String类型的参数,请求方式(p ...
- 两强相争,鹿死谁手 — JQuery中的Ajax与AngularJS中的$http
一.JQuery与AngularJS 首先,先简单的了解一下JQuery与AngularJS.从源头上来说,两者都属于原生JS所封装成的库,两种为平行关系. 二.Ajax请求与数据遍历打印 这里是Aj ...
- jQuery中的$.ajax()方法
jQuery中的$.ajax()方法 $.ajax({ type:"POST", url:"../page/user.action?userId=" + use ...
随机推荐
- salt搭建lamp架构
install_httpd: pkg.installed: - name: httpd httpd_running: service.running: - name: httpd - enable: ...
- BZOJ 4823: [Cqoi2017]老C的方块
分析: 我觉得我的网络流白学了...QAQ... 其实数据范围本是无法用网络流跑过去的,然而出题者想让他跑过去,也就跑过去了... 看到题目其实感觉很麻烦,不知道从哪里入手,那么仔细观察所给出的有用信 ...
- C# 文件类的操作---获取
如何获取指定目录包含的文件和子目录 . DirectoryInfo.GetFiles():获取目录中(不包含子目录)的文件,返回类型为FileInfo[],支持通配符查找: . DirectoryIn ...
- pinctrl框架
pinctrl框架是linux系统为统一各SOC厂家pin管理,目的是为了减少SOC厂家系统移植工作量. 通常通过设备树初始化pinctrl,并提供调用io接口,以下为全志A64平台的实例: 在dri ...
- Oracle rman 全备份的一个小例子
run{ allocate channel d1 type disk; backup database format='/u01/backup/%T_%d_%s.bak'; sql 'alter ...
- Android之BInder分析
MediaService的诞生: nt main(int argc, char** argv) { //FT,就这么简单?? //获得一个ProcessState实例 sp<ProcessS ...
- Centos7/RHEL 7 配置静态路由
如图: 业务地址:192.168.10.0/24 192.168.20.0/24管理地址:172.168.10.0/24 172.168.20.0/24 需求:每台主机配置两张网卡,分别连 ...
- Redis安装-CentOs7
官方地址 确保gcc已经安装 $ yum list installed | grep gcc $ yum install gcc 下载.提取和编辑Redis: $ wget http://downlo ...
- ubuntu下中文输入法安装
个人认为ubantu下fcitx比sogo好用 安装fcitx首先到ubantu软件中心下载fcitx两个软件,一个是配置软件,一个是输入法软件 到system setting中language su ...
- 看不到Harbor我也睡不着觉啊
上午打球,下午陪小孩子看上海科技展,晚上搞定harbor. 完美!!!:) 参考文档: https://www.dwhd.org/20161023_110618.html http://blog.cs ...