SpringMVC框架下利用HighChart请求后台数据时，$.postJSON报错Uncaught TypeError

flzdc 2015-04-24 12:04:57

请问各位：

工程中需要前台显示折线图或者拼图之类的业务，网上搜索到HighChart功能比较齐全，操作比较简单。我在Java桌面工程中测试，可以正确获取后台数据。但是同样的代码集成到SpringMVC框架里，前台jsp页面$.postJSON("hello", function(data)语句报错Uncaught TypeError: $.postJSON is not a function。

后台程序为：

@Controller
@RequestMapping("/highchart/*")
public class BackstageTest extends HttpServlet{

private static final long serialVersionUID = 1L;

@RequestMapping("/dopost")
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
SimpleData data_jane = new SimpleData("Jane" , new Integer[]{1 , 1 , 1});
SimpleData data_john = new SimpleData("Jone" , new Integer[]{5 , 6 , 7});

List<SimpleData> datas = new ArrayList<SimpleData>();
datas.add(data_jane);
datas.add(data_john);

//使用Google的Json工具
Gson gson = new Gson();
//将JSON串返回
PrintWriter out = response.getWriter();
out.print(gson.toJson(datas));
out.flush();
out.close();
}

public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
doPost(request, response);
}

@RequestMapping("/index")
public String index(){
return "/business/dataview/dynamicDataViewIndex";
}
}

前台代码：
<%@ page language="java" contentType="text/html; charset=UTF-8"
import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jstl/core_rt"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">

<title>HighCharts动态展示</title>

<c:set var="ctx" value="${pageContext.request.contextPath}"></c:set>

<script type="text/javascript"
src="${ctx}/resources/js/highchart/jquery-2.1.1.js"></script>
<script src="${ctx}/resources/js/highchart/highcharts.js"></script>
<script src="${ctx}/resources/js/highchart/exporting.js"></script>

<script type="text/javascript">
$(function() {
var options = {
chart : {
type : 'column', //指定图表的类型，默认是折线图（line）
renderTo : 'container'
},
title : {
text : 'My first Highcharts chart' //指定图表标题
},
xAxis : {
categories : [ 'my', 'first', 'chart' ]
//指定x轴分组
},
yAxis : {
title : {
text : 'something' // 指定y轴的标题
}
},
series : []
//指定数据列,这里设为空，我们从后台拿数据
};

//从后台获取json格式的数据
$.postJSON("hello", function(data) {
//插入Json数据
options.series = data;
alert(data);
//初始化chart
var chart = new Highcharts.Chart(options);
});
});
</script>

</head>
<body>
<h3>数据动态展示界面</h3>

<div id="container" style="width: 100%; height: 400px;"></div>
</body>
</html>

我对相关技术不是很清楚，$.postJSON("hello", function(data)中的”hello“是我在web.xml中的配置的：
<servlet>略</servlet>
<servlet-mapping>
<servlet-name>BackstageTest</servlet-name>
<url-pattern>/hello</url-pattern>
</servlet-mapping>

令我比较混乱的是，我在后台使用了springMVC的annotation标注的@RequestMapping，是不是映射路径会与web.xml中的servlet有冲突？？所以会出现这种无法显示界面的错误？？？

感谢各位大神指导……

...全文