【JSP与Servlet之前台页面自动回复之实现】

该内容 来自于imooc的一个视屏教程。http://www.imooc.com/video/4562

就是当点击 发送 的时候把这个对话框内容添加上去,然后由Servlet接收对话框内容参数 并调Service把取得 自动回复 的内容再添加到对话框去。

至于具体的Service实现暂时不关心。

1、首先打开JSP页面找到发送对应的button,添加事件,取名为 send()

2、下一步就是实现这个 send() 方法,这需要用到 AJAX 参考 -->

参考上面的就可以轻易看懂下面的代码了

function send() {
var content = $("#content").val();
if(!content) {
alert("请输入内容!");
return;
}
$.ajax({
url : $("#basePath").val() + "AutoReplyServlet.action",
type : "POST",
dataType : "text",
timeout : 10000,
success : function (data) {
appendDialog("talk_recordboxme","My账号",content);
appendDialog("talk_recordbox","公众号",data);
$("#content").val("");
render();
},
data : {"content":content}
});
} 

很典型的 $("#content").val() 既充当了 getter 也充当了 setter

完整的代码贴在底部 -->

3、把这个 .js 文件包含进JSP页面

    <script type="text/javascript" src="<%= basePath %>resources/js/front/talk.js"></script>

4、随便写个 Servlet 测试一下

package com.imooc.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; // import com.imooc.service.QueryService; /**
* 自动回复功能控制层,
* 针对AJAX的
*/
@SuppressWarnings("serial")
public class AutoReplyServlet extends HttpServlet {
@Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp)
throws ServletException, IOException {
resp.setContentType("text/html;charset=utf-8");
PrintWriter out = resp.getWriter();
out.write("我听不懂你在说啥"); // 本来这里是需要调Service的
out.close();
} @Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp)
throws ServletException, IOException {
this.doGet(req, resp);
}
}

完善 Service 之后就大功告成了。。。

JSP页面

<%@ page contentType="text/html; charset=UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>微信公众号</title>
<!--讨论区滚动条begin-->
<link rel="stylesheet" type="text/css" href="<%= basePath %>resources/css/jscrollpane1.css" />
<script src="<%= basePath %>resources/js/common/jquery-1.8.0.min.js" type="text/javascript"></script>
<!-- the mousewheel plugin -->
<script type="text/javascript" src="<%= basePath %>resources/js/common/jquery.mousewheel.js"></script>
<!-- the jScrollPane script -->
<script type="text/javascript" src="<%= basePath %>resources/js/common/jquery.jscrollpane.min.js"></script>
<script type="text/javascript" src="<%= basePath %>resources/js/common/scroll-startstop.events.jquery.js"></script>
<!--讨论区滚动条end-->
<script type="text/javascript" src="<%= basePath %>resources/js/front/talk.js"></script>
</head>
<body>
<input type="hidden" value="<%= basePath %>" id="basePath"/>
<br/>
<div class="talk">
<div class="talk_title"><span>正在与公众号对话</span></div>
<div class="talk_record">
<div id="jp-container" class="jp-container"> </div>
</div> <div class="talk_word">
&nbsp;
<input class="add_face" id="facial" type="button" title="添加表情" value="" />
<input id="content" class="messages emotion" />
<input class="talk_send" onclick="send();" type="button" title="发送" value="发送" />
</div>
</div>
<div style="text-align:center;margin:50px 0; font:normal 14px/24px 'MicroSoft YaHei';"></div>
</body>
</html>

JS函数(太长。。。不贴了

JSP与Servlet之前台页面自动回复之实现的更多相关文章

  1. JSP与Servlet之后台页面单条删除与多条删除的页面跳转之实现

    单条删除页面跳转 1.首先打开JSP页面,找到删除 2.这个时候要把它改成servlet的URL,并决定要传给后台什么数据,例如我需要传一个待删数据的ID id并不是什么见不得人的东西(而且是后台也不 ...

  2. SpringMVC内容略多 有用 熟悉基于JSP和Servlet的Java Web开发,对Servlet和JSP的工作原理和生命周期有深入了解,熟练的使用JSTL和EL编写无脚本动态页面,有使用监听器、过滤器等Web组件以及MVC架构模式进行Java Web项目开发的经验。

    熟悉基于JSP和Servlet的Java Web开发,对Servlet和JSP的工作原理和生命周期有深入了解,熟练的使用JSTL和EL编写无脚本动态页面,有使用监听器.过滤器等Web组件以及MVC架构 ...

  3. 前台页面获取servlet传过来的数据

    servlet中的代码: public void doGet(HttpServletRequest request, HttpServletResponse response) throws Serv ...

  4. 一、JSP、servlet、SQL三者之间的数据传递(前台与后台数据交互)

    背景: 目前业界很流行的MVC(model-view-control)开发模式,理解为 模型是Bean, 视图是 Html/Jsp, 控制是Servlet, 关联数据库的Dao web的运行机制: 数 ...

  5. Jsp与servlet之间页面跳转及参数传递实例(转)

    原网址:http://blog.csdn.net/ssy_shandong/article/details/9328985 11. jsp与servlet之间页面跳转及参数传递实例 分类: Java ...

  6. jsp页面中某个src,如某个iframe的src,应该填写什么?可以是html、jsp、servlet、action吗?是如何加载的?

    jsp页面中某个src,如某个iframe的src,应该填写什么?可以是html.jsp.servlet.action吗?是如何加载的? 如有个test工程,其某个jsp中有个iframe,代码如下: ...

  7. JSP、Servlet中的相对路径和绝对路径 页面跳转问题

    转自:http://blog.csdn.net/wym19830218/article/details/5503533/ 1.JSP.Servlet中的相对路径和绝对路径 前提:假设你的Http地址为 ...

  8. 【转】(超详细)jsp与servlet之间页面跳转及参数传递实例

    初步学习JavaEE,对其中jsp与Servlet之间的传值没弄清楚,查看网上资料,发现一篇超详细的文章,收获大大,特此记录下来.具体链接:http://blog.csdn.net/ssy_shand ...

  9. jsp和servlet的区别

    servlet是服务器端的程序,动态生成html页面发到客户端,但是这样 程序里有许多out.println(),java和html语言混在一起很乱.所以 后来推出了jsp.其实jsp就是servle ...

随机推荐

  1. cobbler default system 网络安装时主机的menu上只有一个local选项

    问题:使用cobbler default system 做pxe网络安装时,主机启动后安装menu上只有一个local选项,看不到对应的system名字 解决:cobbler default syst ...

  2. 【python】map list for 运行时长测试

    import time,sys reps=1000 size=10000 def tester(func,*args): starttime=time.time() for i in range(re ...

  3. ChemDraw的“键”工具的作用是什么

    ChemDraw的“键”工具在化学研究中能够发挥重大作用,如果你也是一名化学相关工作者就千万不要错过这篇教程,下文详细盘点“键”工具究竟能干些什么. ChemDraw化学软件免费获取地址:http:/ ...

  4. 第七篇:两个经典的文件IO程序示例

    前言 本文分析两个经典的C++文件IO程序,提炼出其中文件IO的基本套路,留待日后查阅. 程序功能 程序一打印用户指定的所有文本文件,程序二向用户指定的所有文本文件中写入数据. 程序一代码及其注释 # ...

  5. IOS-添加分段控件SegmentControl

    本文转载至 http://www.cnblogs.com/tx8899/archive/2012/06/05/2537020.html 添加分段控件 控件是一种小型的.自包含的UI组件,可以用在各种U ...

  6. 《转》Win7 IIS7.5 安装

    一.进入Win7的 控制面板,选择左侧的 打开或关闭Windows功能. 二.现在出现了安装Windows功能的选项菜单,注意选择的项目,我们需要手动选择需要的功能,下面这张图片把需要安装的服务都已经 ...

  7. Linux下的Make与Makefile

    原文转载自:http://www.cpplive.com/html/1776.html 另外一个不错的博客http://bbs.chinaunix.net/thread-1950588-1-1.htm ...

  8. 云计算和SDN中的开源交换机介绍以及使用

    之前关于SDN的开发工作都是在控制器层面上(以ryu为主),现在开始了新的工程项目,需要同时修改控制器和交换机的源码,如果后续项目需要,还可能需要加中间层——网络虚拟层,这部分的知识已经在前面读过了相 ...

  9. 170302、 Apache 使用localhost(127.0.0.1)可以访问,使用本机局域网IP(192.168.2.*)不能访问

    对于此问题的解决办法,打开apache安装路径中的http.conf文件, 找打以下内容 #   onlineoffline tag - don't remove        Order Deny, ...

  10. 导出Excel功能的3种实现

    项目中总会用到Excel的导出功能,接触过好几个项目,发现有个项目的导出实现特别值得学习.这里学习顺带总结一下. 一.三种方法 我遇到的导出目前有3种处理: 每个功能一个导出方法: 写一个通用的Exp ...