JQuery异步请求(ajax)

$.ajax({
// 请求方式为get或者post等
type: "GET",
// 服务器响应的数据类型
dataType: "json",
// 请求的url(一般为后台接口)
url: "test.json",
// 发送到服务器的参数,
data: {user:"xiao"},
// 请求成功后返回的数据,赋值给变量'data'
success: function(data){
// 对data进行操作
},
// 请求失败异常后,返回的错误信息
error: function(err){ }
});

1. get( url, [data], [callback] ) :

$.get("route/findAllRoute",{"cid":cid,"curentPage":curentPage,"pageCount":pageCount},function (data) {
writepage(data);
})

2. post( url, [data], [callback] ) :

$.post("route/findTheRoute",{"rid":rid},function (data) {
if(data.flag){
$(".titleCategory:eq(0)").html(data.data.category.cname);
$(".titleRoute:eq(0)").html(data.data.routeIntroduce);
$("#bigPic").attr("src",data.data.routeImgList[0].bigPic);
var littleImg='<a class="up_img up_img_disable"></a>';
for(var i=0;i<data.data.routeImgList.length;i++){
if(i>3){
littleImg+='<a title="" class="little_img" data-bigpic="'+data.data.routeImgList[i].bigPic+'" style="display:none;">\n' +
'<img src="'+data.data.routeImgList[i].smallPic+'">\n' +
'</a>';
}else {
littleImg+='<a title="" class="little_img" data-bigpic="'+data.data.routeImgList[i].bigPic+'">\n' +
'<img src="'+data.data.routeImgList[i].smallPic+'">\n' +
'</a>';
}
}
littleImg+='<a class="down_img down_img_disable" style="margin-bottom: 0;"></a>';
$("#littlePics").html(littleImg);
$(".titleCategory:eq(1)").html(data.data.rname);
$(".titleRoute:eq(1)").html(data.data.routeIntroduce);
/*<p id="sname">经营商家 :中国国旅</p>
<p id="sphone">咨询电话 : 400-000-1111</p>
<p id="address"> 地址 : xxxxxxxx</p>*/
$("#sname").html("经营商家 : "+data.data.seller.sname);
$("#sphone").html("咨询电话 : "+data.data.seller.consphone);
$("#address").html("地址 : "+data.data.seller.address);
$("#price").html(data.data.price);
$("#count").html("已收藏"+data.data.count+"次");
loadImgs();
var timer=setInterval(auto_play,2000);
}
});

3. load( url, [data], [callback] ) :

载入远程 HTML 文件代码并插入至 DOM 中。

url (String) : 请求的HTML页的URL地址。

data (Map) : (可选参数) 发送至服务器的 key/value 数据。

callback (Callback) : (可选参数) 请求完成时(不需要是success的)的回调函数。

这个方法默认使用 GET 方式来传递的,如果[data]参数有传递数据进去,就会自动转换为POST方式的。jQuery 1.2 中,可以指定选择符,来筛选载入的 HTML 文档,DOM 中将仅插入筛选出的 HTML 代码。语法形如 “url #some > selector”。

这个方法可以很方便的动态加载一些HTML文件,例如表单。

$(".ajax.load").load("http://www.cnblogs.com/yeer/archive/2009/06/10/1500682.html .post",

function (responseText, textStatus, XMLHttpRequest){

this;//在这里this指向的是当前的DOM对象,即$(".ajax.load")[0] 

//alert(responseText);//请求返回的内容
//alert(textStatus);//请求状态:success,error
//alert(XMLHttpRequest);//XMLHttpRequest对象
});

表单序列化

1.serialize()方法

格式:var data = $(“form”).serialize();

功能:将表单内容序列化成一个字符串。

这样在ajax提交表单数据时,就不用一一列举出每一个参数。只需将data参数设置为 $(“form”).serialize() 即可

  

$("#btLogin").click(function () {
$.post("user/login",$("#loginForm").serialize(),function (data) {
console.log($("#loginForm").serialize());
if (data.flag) {
//跳转到首页
location.href = "index.html";
}else{
$("#errorMsg").text(data.errorMsg);
}
});
});
console.log($("#loginForm").serialize());
结果:
action=login&username=aaaaaaa&password=hhhhhhhhh&check=a2d4

2.serializeArray()方法

格式:var jsonData = $(“form”).serializeArray();

功能:将页面表单序列化成一个JSON结构的对象。注意不是JSON字符串。

比如,[{“name”:“lihui”, “age”:“20”},{…}] .

Servlet简化,方法分发,模仿HttpServlet的service方法

1.写一个BaseServlet extends HttpServlet

public class BaseServlet extends HttpServlet {
@Override
protected void service(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
req.setCharacterEncoding("utf-8");
//获取URI---> user/login
String reqURI = req.getRequestURI();
//获取请求的方法名--->将URI从最后一次'/'出现的位置切割,提取方法名login
String method = reqURI.substring(reqURI.lastIndexOf('/')+1);
// System.out.println(method);
try {
Class<? extends BaseServlet> aClass = this.getClass();
//得到子类Sevlet字节码文件,用字节码文件提取子类servlet的所有方法数组
Method[] methods = aClass.getMethods();
//遍历数组
for (Method m:methods) {
// System.out.println(m.getName());
//找到请求的方法名为method的方法
if(m.getName().equals(method)){
//调用方法,this就是子类Servlet对象
// m.invoke(servlet,req,resp);
m.invoke(this,req,resp);
}
}
} catch (IllegalAccessException e) {
e.printStackTrace();
} catch (InvocationTargetException e) {
e.printStackTrace();
}
}

2.写子类Servlet继承BaseSevlet

package com.dbxy.travel.web.servlet;

import com.bdqn.travel.pojo.Category;
import com.bdqn.travel.pojo.PageRoute;
import com.bdqn.travel.pojo.ResultInfo;
import com.bdqn.travel.pojo.Route;
import com.dbxy.travel.service.CategoryService;
import com.dbxy.travel.service.CategoryServiceImpl;
import com.dbxy.travel.service.RouteService;
import com.dbxy.travel.service.RouteServiceImpl; import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.io.UnsupportedEncodingException;
import java.net.URLDecoder;
import java.util.ArrayList;
import java.util.List; @WebServlet("/route/*")
public class RouteServlet extends BaseServlet{
private RouteService service=new RouteServiceImpl();
public void findAllRoute(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
String nowpage = request.getParameter("curentPage");
String cid=request.getParameter("cid");
PageRoute<Route> allRoute = service.findAllRoute(Integer.parseInt(nowpage), Integer.parseInt(cid));
returnResult(allRoute,response);
}
public void findTheRoute(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
String rid=request.getParameter("rid");
ResultInfo info = service.findRouteByRid(Integer.parseInt(rid));
returnResult(info,response);
}
public void findRouteBySearchName(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
String nowpage = request.getParameter("curentPage");
String search= request.getParameter("search");
String decodeSearch = null;
try {
System.out.println(nowpage);
decodeSearch = URLDecoder.decode(search, "utf-8");
} catch (UnsupportedEncodingException e) {
e.printStackTrace();
}
// System.out.println("now"+nowpage);
PageRoute<Route> pageRoute=service.findRouteBySearchName(decodeSearch,Integer.parseInt(nowpage));
returnResult(pageRoute,response);
}
public void findRouteBySearchNameAndCid(HttpServletRequest request, HttpServletResponse response){
String nowpage = request.getParameter("curentPage");
String search= request.getParameter("search");
String cid = request.getParameter("cid");
String decodeSearch = null;
try {
System.out.println(nowpage);
decodeSearch = URLDecoder.decode(search, "utf-8");
} catch (UnsupportedEncodingException e) {
e.printStackTrace();
}
PageRoute<Route> pr=service.findRouteBySearchNameAndCid(Integer.parseInt(nowpage),decodeSearch,Integer.parseInt(cid));
returnResult(pr,response);
}
public void findFavoriteRoutes(HttpServletRequest request, HttpServletResponse response){
String nowpage = request.getParameter("curentPage");
PageRoute<Route> favoriteRoutes = service.findFavoriteRoutes(Integer.parseInt(nowpage));
returnResult(favoriteRoutes,response);
// System.out.println(favoriteRoutes);
}
public void favoriteSearch(HttpServletRequest request, HttpServletResponse response){
String search= request.getParameter("searchName");
String nowpage= request.getParameter("curentPage");
String decodeSearch = "";
try {
decodeSearch = URLDecoder.decode(search, "utf-8");
} catch (UnsupportedEncodingException e) {
e.printStackTrace();
}
String minPrice= request.getParameter("minPrice");
String maxPrice= request.getParameter("maxPrice");
PageRoute<Route> pr =service.favoriteSearch(Integer.parseInt(nowpage),decodeSearch,minPrice,maxPrice);
returnResult(pr,response);
}
}

JavaWeb项目:旅游网站【涉及各种知识】的更多相关文章

  1. 使用极路由进行外网映射,本地电脑做服务器,运行javaWeb项目

    最近在学习javaWeb,一个项目需要android访问服务器,于是使用自己的笔记本电脑作为服务器,需要进行端口映射.使得外网可以访问自己的javaWeb项目或者网站之类的.普通路由请看:http:/ ...

  2. 关于服务器响应,浏览器请求的理解以及javaWeb项目的编码问题

    1.服务器(Server)响应,浏览器(Brower)请求: 对于B/S的软件,数据的传递体现在,用户利用浏览器请求,以获得服务器响应.在JavaWeb项目中,大致包含.java文件的数据处理模块,和 ...

  3. TravelCMS旅游网站系统诞生记

    本人就是一纯粹码农,没什么学历,更没什么技术,但是自认为学习能力还不错,近期有一个旅游网站系统项目正在进行中,在此以贴图记录这个项目的诞生过程,本是一个定制系统,但是不想把系统做死,以通用产品的标准来 ...

  4. JavaWeb 项目中的绝对路径和相对路径以及问题的解决方式

    近期在做JavaWeb项目,总是出现各种的路径错误,并且发现不同情况下 /  所代表的含义不同,导致在调试路径上浪费了大量时间. 在JavaWeb项目中尽量使用绝对路径  由于使用绝对路径是绝对不会出 ...

  5. JavaEE——Intellij Idea 创建JavaWeb项目

    原文:JavaEE--Intellij Idea 创建JavaWeb项目 折腾Tomcat折腾了两个晚上,第一个晚上怎么都进不了Tomcat的首页,第二个晚上进去了,但是新建的Web项目,在浏览器中运 ...

  6. 《从零玩转JavaWeb+项目实战》-系列课堂录制计划

    点击试听课程 前言 很多自学编程的同学经常和我说想学一门语言自己到网上找一些教程看到一半就像背单词背到ambulance一样坚持不下去了....究其原因基本上都是:内容太多,太枯燥,专业术语听不懂,学 ...

  7. Javaweb项目开发的前后端解耦的必要性

    JavaWeb项目为何我们要放弃jsp?为何要前后端解耦?为何要动静分离? 使用jsp的痛点: 1.jsp上动态资源和静态资源全部耦合在一起,服务器压力大,因为服务器会收到各种静态资源的http请求, ...

  8. JavaWeb项目架构之Kafka分布式日志队列

    架构.分布式.日志队列,标题自己都看着唬人,其实就是一个日志收集的功能,只不过中间加了一个Kafka做消息队列罢了. kafka介绍 Kafka是由Apache软件基金会开发的一个开源流处理平台,由S ...

  9. 利用Jenkins实现JavaWeb项目的自动化部署

    修改代码,打包,上传,重启... 大把的时间花费在这些重复无味的工作上.笔者与当前主流的价值观保持一致:我们应该把时间花费在更有意义的事情上.我们可以尝试借助一些工具,让这些重复机械的工作交给计算机去 ...

  10. redhat7学习笔记之从零到部署javaweb项目

    REDHAT7学习笔记 1. 安装vmware10 安装过程略,下载地址:链接: https://pan.baidu.com/s/16odKKkRYBxGWDVo1cz_wxA 注意,10以上版本不在 ...

随机推荐

  1. AntDesignPro的权限控制和动态路由

    最近看了AntDesignPro关于权限控制的官方文档以及自己框架里权限控制的实现,总结一下. 先贴一下官网上关于权限控制的图有利于理解 步骤如下: 判断是否有 AccessToken 如果没有则跳转 ...

  2. Spring 学习 之 再探publish-event机制

    之前的文章链接:https://blog.csdn.net/qq_41907991/article/details/88544777 我们要知道的是,Spring的publish-event使用的是监 ...

  3. 13_JavaScript基础入门(3)

    条件分支语句 条件分支语句,也叫作条件判断语句,就是根据某种条件执行某些语句,不执行某些语句. JS中有三种语法是可以表示条件分支的. 1.if--else-- 条件分支的主力语法,这个主力语法能够书 ...

  4. 【FPGA篇章一】FPGA工作原理:详细介绍FPGA实现编程逻辑的机理

    欢迎大家关注我的微信公众账号,支持程序媛写出更多优秀的文章 FPGA(Field Programmable Gate Array),即现场可编程逻辑门阵列,它是作为专用集成电路(ASIC)领域中一种半 ...

  5. 【Spark】SparkStreaming的容错机制

    文章目录 检查点机制 驱动器程序容错 工作节点容错 接收器容错 处理保证 检查点机制 Metadata checkpointing -- 将定义流计算的信息存入容错的系统如HDFS. Data che ...

  6. Owin Katana 的底层源码分析

    最近看了一下开源项目asp.net katana,感觉公开的接口非常的简洁优雅,channel 9 说是受到node.js的启发设计的,Katana是一个比较老的项目,现在已经整合到asp.net c ...

  7. FPGA六位共阳极数码管动态显示

    `timescale 1ns/1ps module adc_dis( clk , rst_n , sm_seg , sm_bit ); input clk;//50HZ input rst_n; :] ...

  8. Linux vim 常用命令(不定时update)

    1.退出 先esc  再:q 2.保存退出 先Esc 再:wq 3.强制退出 先Esc 再:q! 4.寻找关键字 先 shift+ 再/keyword 5.查看行数 set nu 6.跳到指定行(例如 ...

  9. 让写作省心一点——Markdown和CSS实践

    1 引言 今天这篇推送和以往不太一样,乍一看就能发现格式有了变化.没错,这是我专门设计的品牌模板,也就是本公众号以后创作的文章可直接套用,获得一致的风格样式. 除此以外,文章里的全部元素(包括标题.表 ...

  10. C# 数据操作系列 - 8. EF Core的增删改查

    0.前言 到目前为止,我们看了一下如何声明EF Core的初步使用,也整体的看了下EF Core的映射关系配置以及导航属性的配置. 这一篇,我带大家分享一下,我在工作中需要的EF Core的用法. 1 ...