1、建立数据库名为bbs
1.1建立表名Model、article、reply分别为板块名、文章列表和回复表
Model下字段为:mid、mtitle、muser,分别为板块号、板块标题、板块管理员，将mid设置为自增主键，mtitle设置为varchar，mid和muser设置为int
Article下字段为:aid、atitle、acontent、mid、auserId、acreatetime,分别为文章号，文章标题，文章内容和板块id,文章发布者id,创建的时间,aid和mid设置为int,atitle和acontent设置为varchar,acreatetime设置为DataTime
Reply字段下为:rid、rcontent、ruserId、aid、rcreatetime,分别为回复号,回复的内容,回复者id,文章id，回复时间。其中，rid,ruserId、aid设置为int，rcontent设置为varchar,rcreatetime设置为TIMEStamp.
注：article靠mid来判断板块，replay靠aid来判断所属文章
2、建立article.jsp文件来存放输出内容
2.1 在body中添加一个下拉菜单，将从数据库返回的数据，存入id为articlelist的div块中
<select name="mid" id="mid">
<option value="1">王者荣耀</option>
<option value="2">dota</option>
<option value="3">魔兽世界</option>
</select>
<div id="articList">
</div>
2.2 在article.jsp中导入需要的js文件：
<script src="js/jquery1.11.3.min.js"></script>
<script src="js/article.js"></script>
2.3下载并导入需要的一个将数据库返回数据转换成json的一个包
包名为：fastjson-1.2.5.jar,将其放在WebContent 下的WEB-INF下的lib文件夹下，然后，右键选择build path, 选择add path。
此时，还有一个与数据库相连的包需要导入，名为：
mysql-connector-java-5.1.7-bin.jar,方法相同
3、在article.js中写入以下代码，用来提取从服务器返回的数据
$(function(){
$("#mid").change(function(){
var mid=$(this).val();
//传到服务器查询该板块下的帖子
$.getJSON("GetArticSevlet?mid="+mid,function(obj){
//alert(obj);
//清空div
$("#articList").empty();
//obj存放的是json数组
$.each(obj,function(k,v){
//追加当前板块下的帖子
$("#articList").append(v.atitle+"<br/>");
})
})
})
})
4、在GetArticSevlet.servlet下写入以下代码，用来建立与数据库的连接并且将返回数据转换为 json数据
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// TODO Auto-generated method stub
//response.getWriter().append("Served at: ").append(request.getContextPath());
response.setContentType("text/html;charset=UTF-8");
request.setCharacterEncoding("UTF-8");
//1.获得mid
String mid=request.getParameter("mid");
//2.查询该板块下的帖子
String sql="select * from article where mid=?";
List<Object> paramList=new ArrayList<Object>();
paramList.add(mid);
DbHelper dbHelper=new DbHelper();
List<Map<String, Object>> list= dbHelper.executeQuery(sql, paramList);
//3、自动转换成json
String jsonstr=JSON.toJSONString(list);
response.getWriter().println(jsonstr);
}
注：如果不导fastjson包，可以自己写以下代码，用来替换最后两句，将数据库返回数据修改为json数据
//4、转换为json字符串,json格式：{"aid":1,"atitle":"hello"},{"aid":2,"atitle":"hello2"},
StringBuilder jsonstr=new StringBuilder();
jsonstr.append("[");
for(Map<String, Object> map:list)
{
jsonstr.append("{");
Set<String> keys= map.keySet();
for(String key:keys)
{
jsonstr.append(key);
jsonstr.append(":");
jsonstr.append("'"+map.get(key)+"',");
}
jsonstr.delete(jsonstr.length()-1, jsonstr.length());
jsonstr.append("},");
}
jsonstr.delete(jsonstr.length()-1, jsonstr.length());
jsonstr.append("]");
注：其中还用到了一个db.properties的数据库相关配置文件，放在GetArticSevlet上级目录的根目录下，内容为
driver=com.mysql.jdbc.Driver
url=jdbc:mysql://localhost:3306/数据表名?characterEncoding=utf-8
uname= 数据库用户名
pwd=数据库密码
