关于$.ajax 中 success : function(result) 不执行的问题

[这有点麻烦啊]

这是部分前端代码
$.ajax({
type : "post",
async : true, //异步请求（同步请求将会锁住浏览器，用户其他操作必须等待请求完成才可以执行）
url : "yearcount", //请求发送到TestServlet处
data : {},
dataType : "json", //返回数据形式为json

success : function(result) {
//请求成功时执行该函数内容，result即为服务器返回的json对象
alter(result);
if (result) {
for ( var i = 0; i < result.length; i++) {
xAxis_val.push(result[i].year); //挨个取出类别并填入类别数组
alter(result[i].year);
}
for ( var i = 0; i < result.length; i++) {
data_val.push(result[i].count); //挨个取出销量并填入销量数组

}
myChart.hideLoading(); //隐藏加载动画
myChart.setOption({ //加载数据图表
xAxis : {
data : xAxis_val
},
series : [ {
// 根据名字对应到相应的系列
name : '人数',
data : data_val
} ]
});

}

},
error : function(errorMsg) {
//请求失败时执行该函数
alert("图表请求数据失败!");
myChart.hideLoading();
}
})

其中yearcount通过servlet跳到YearCountServlet.java
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import org.slf4j.Logger;
import org.slf4j.LoggerFactory;

import com.fasterxml.jackson.databind.ObjectMapper;
import com.wzulib.echartdata.Yearcount;


public class YearCountServlet extends HttpServlet {

/**
*
*/
private static final long serialVersionUID = -6780714644001995406L;
private static final transient Logger log = LoggerFactory.getLogger(YearCountServlet.class);

@Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
doPost(req,resp);
}

@Override
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

log.info("===============================YearCountServlet doPost===============================");
List<Yearcount> list = new ArrayList<Yearcount>();


list.add(new Yearcount("2007", 303456)); //两个的类型为 String和int
list.add(new Yearcount("2008", 3350615));
list.add(new Yearcount("2009", 3179383));
list.add(new Yearcount("2010", 2889159));
list.add(new Yearcount("2011", 2551751));
list.add(new Yearcount("2012", 1671662));
list.add(new Yearcount("2013", 1503558));
list.add(new Yearcount("2014", 938038));
list.add(new Yearcount("2015", 891236));
list.add(new Yearcount("2016", 563229));

ObjectMapper mapper = new ObjectMapper(); //提供java-json相互转换功能的类

String json = mapper.writeValueAsString(list); //将list中的对象转换为Json格式的数组


System.out.println(json);
//将json数据返回给客户端
response.setContentType("text/html; charset=utf-8");
response.getWriter().write(json);


}

}
这是部分日志输出
2016-11-20 20:43:16,435 TRACE [org.apache.shiro.subject.support.DelegatingSubject] - attempting to get session; create = false; session is null = false; session has id = true
2016-11-20 20:43:16,435 TRACE [org.apache.shiro.subject.support.DelegatingSubject] - attempting to get session; create = false; session is null = false; session has id = true
2016-11-20 20:43:16,435 TRACE [org.apache.shiro.subject.support.DelegatingSubject] - attempting to get session; create = false; session is null = false; session has id = true
2016-11-20 20:43:16,435 TRACE [org.apache.shiro.web.servlet.AbstractShiroFilter] - No FilterChain configured for the current request. Using the default.
2016-11-20 20:43:16,436 INFO [com.wzulib.servlet.YearCountServlet] - ===============================YearCountServlet doPost===============================
[{"year":"2007","count":303456},{"year":"2008","count":3350615},{"year":"2009","count":3179383},{"year":"2010","count":2889159},{"year":"2011","count":2551751},{"year":"2012","count":1671662},{"year":"2013","count":1503558},{"year":"2014","count":938038},{"year":"2015","count":891236},{"year":"2016","count":563229}]


可以看到success : function(result) 中的alter(result); 都没有输出
新人第一次发帖还请大家多多指教啊

[拘谨的小人]

response.setContentType("text/html; charset=utf-8"); 去掉试试

[这有点麻烦啊]

引用 1 楼 u012943783 的回复:

response.setContentType("text/html; charset=utf-8"); 去掉试试

不行啊。

[这有点麻烦啊]

<script type="text/javascript"> var myChart = echarts.init(document.getElementById('main')); // 显示标题，图例和空的坐标轴 myChart.setOption({ title: { text: '异步数据加载示例' }, tooltip: {}, legend: { data:['销量'] }, xAxis: { data: [] }, yAxis: {}, series: [{ name: '销量', type: 'bar', data: [] }] }); myChart.showLoading(); //数据加载完之前先显示一段简单的loading动画 var names=[]; //类别数组（实际用来盛放X轴坐标值） var nums=[]; //销量数组（实际用来盛放Y坐标值） $.ajax({ type : "post", async : true, //异步请求（同步请求将会锁住浏览器，用户其他操作必须等待请求完成才可以执行） url : "TestServlet", //请求发送到TestServlet处 data : {}, dataType : "json", //返回数据形式为json beforeSend: function() { alter("怎么不会输出啊"); }, success : function(result) { //请求成功时执行该函数内容，result即为服务器返回的json对象 alter(result); if (result) { for(var i=0;i<result.length;i++){ names.push(result[i].name); //挨个取出类别并填入类别数组 } for(var i=0;i<result.length;i++){ nums.push(result[i].num); //挨个取出销量并填入销量数组 } myChart.hideLoading(); //隐藏加载动画 myChart.setOption({ //加载数据图表 xAxis: { data: names }, series: [{ // 根据名字对应到相应的系列 name: '销量', data: nums }] }); } }, error : function(errorMsg) { //请求失败时执行该函数 alert("图表请求数据失败!"); myChart.hideLoading(); } }) </script> 这个可以出效果图（图表是打印出来的），但是alter()一句没执行？

[___d]

方法为什么要定义成void 用直接返回json的试试

[kahnyy5202015]

首先你的ajax确定调到这个servlet没有。。再试试下面这个 response.getWriter().print(json); response.getWriter().close();

[游一游走一走]

返回类型不正确，js要求返回json类型，你返回的是html

res.setContentType(org.apache.http.entity.ContentType.APPLICATION_JSON.toString());

[这有点麻烦啊]

引用 5 楼 kahnyy5202015 的回复:

首先你的ajax确定调到这个servlet没有。。再试试下面这个 response.getWriter().print(json); response.getWriter().close();

日志有输出

[这有点麻烦啊]

哎呀，后来把alter全去掉，加了一个 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <%--<meta http-equiv="X-UA-Compatible" content="IE=7"></meta>--%> <meta http-equiv="X-UA-Compatible" content="IE=edge"/> 就好了，主要是alter()这货惹的祸啊

[roger-jie]

应该是alert()吧????

[Hasee_777]

resule和data有什么区别

[weixin_44706581]

<div id="main" style="width: 300px;height:300px;position:absolute;margin-top:260px;margin-left:40px"></div> <script type="text/javascript"> // 基于准备好的dom，初始化echarts实例 var myChart = echarts.init(document.getElementById('main')); // 指定图表的配置项和数据 //数据加载完之前先显示一段简单的loading动画 myChart.showLoading(); var names=[]; //类别数组（实际用来盛放X轴坐标值） var nums=[]; //销量数组（实际用来盛放Y坐标值） $.ajax({ type : "post", async : true, //异步请求（同步请求将会锁住浏览器，用户其他操作必须等待请求完成才可以执行） url : "${pageContext.request.contextPath}/selectSex", //请求发送到控制层处 data : {}, dataType : "json", //返回数据形式为json success : function(result) { //请求成功时执行该函数内容，result即为服务器返回的json对象 if (result) { for(var i=0;i<result.length;i++){ names.push(result[i].sex); //挨个取出类别并填入类别数组 } for(var i=0;i<result.length;i++){ nums.push(result[i].count); //挨个取出销量并填入销量数组 } myChart.hideLoading(); //隐藏加载动画 var option = { title: { text: '异步数据加载示例' }, tooltip: {}, legend: { data:['数量'] }, xAxis: [{ data: names, axisLine:{ lineStyle:{ color:'#FF0000', width:1,//这里是为了突出显示加上的 } } }], yAxis: [{ axisLine:{ lineStyle:{ color:'#FF0000', width:1,//这里是为了突出显示加上的 } } }], series: [{ name: '数量', data: nums, type: 'bar', /* 设置柱子的宽度 */ barWidth : 30, itemStyle: { //通常情况下： normal:{ 　　　　　　　　　　　　//每个柱子的颜色即为colorList数组里的每一项，如果柱子数目多于colorList的长度，则柱子颜色循环使用该数组 color: function (params){ var colorList = ['#B5C334','#FCCE10','#E87C25','#27727B','#FE8463','#9BCA63','#FAD860','#F3A43B','#60C0DD','#D7504B','#C6E579','#F4E001','#F0805A','#26C0C0']; return colorList[params.dataIndex]; } }, //鼠标悬停时： emphasis: { shadowBlur: 10, shadowOffsetX: 0, shadowColor: 'rgba(0, 0, 0, 0.5)' } }, }], 　　　　　//控制边距　 grid: { left: '0%', right:'10%', containLabel: true, }, }; myChart.setOption(option); } }, error : function(errorMsg) { //请求失败时执行该函数 alert("图表请求数据失败!"); myChart.hideLoading(); } }) </script>

[weixin_44706581]