为什么HTML中ajax函数不生效

来源:2-4 实现动态图表

weixin_慕少0536252

2020-03-11 22:55:39

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Insert title here</title>

<script type="text/javascript" src="js/echarts.min.js"></script>

<script type="text/javascript" src="js/jquery-3.4.1.min.js"></script>

</head>

<body>

<div id="main" style="width: 600px;height:400px;"></div>

<script type="text/javascript">

$.ajax({

"url ": "/listener/rc",

"type" : "get",

"dataType" : "json",

"success" : function(json){

var myChart = echarts.init(document.getElementById('main'));


        // 指定图表的配置项和数据

        var option = {

            title: {

                text: '请求流量数据统计'

            },

            tooltip: {},

            legend: {

                data:['访问量']

            },

            xAxis: {

                data: json.timeList

            },

            yAxis: {},

            series: [{

                name: '访问量',

                type: 'line',

                data: json.valueList

            }]

        };


        // 使用刚指定的配置项和数据显示图表。

        myChart.setOption(option);

}

});

        // 基于准备好的dom,初始化echarts实例

        

    </script>

</body>

</html>


package com.bbwan.servlet;


import java.io.IOException;

import java.util.HashMap;

import java.util.List;

import java.util.Map;


import javax.servlet.ServletException;

import javax.servlet.annotation.WebServlet;

import javax.servlet.http.HttpServlet;

import javax.servlet.http.HttpServletRequest;

import javax.servlet.http.HttpServletResponse;


import com.alibaba.fastjson.JSON;


/**

 * Servlet implementation class ReuquestCountServlet

 */

@WebServlet("/rc")

public class ReuquestCountServlet extends HttpServlet {

private static final long serialVersionUID = 1L;

       

    /**

     * @see HttpServlet#HttpServlet()

     */

    public ReuquestCountServlet() {

        super();

        // TODO Auto-generated constructor stub

    }


/**

* @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)

*/

protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

List<String> timeList=(List)request.getServletContext().getAttribute("timeList");

List<String> valueList=(List)request.getServletContext().getAttribute("valueList");

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

// response.getWriter().println(timeList.toString()+"<br/>");

// response.getWriter().println(valueList.toString());

Map map=new HashMap();

map.put("timeList", timeList);

map.put("valueList", valueList);

String json=JSON.toJSONString(map);

response.getWriter().println(json);

}


/**

* @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)

*/

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

// TODO Auto-generated method stub

doGet(request, response);

}


}


写回答

1回答

好帮手慕小脸

2020-03-12

同学你好,这里ajax里面的内容无需加上双引号。具体修改如下:

http://img.mukewang.com/climg/5e69a67c09c49a3105020307.jpg

如果我的回答解决了你的疑惑,请采纳,祝学习愉快~

1

0 学习 · 9666 问题

查看课程