可取消判断是否为2的，ajax也可以不用传2

来源：3-8 实现二级联动菜单-2

kevin唯心

2019-11-03 15:16:16

package com.imooc.ajax;

import java.io.IOException;
import java.util.ArrayList;
import java.util.List;

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 ChannelServlet
 */
@WebServlet("/channel")
public class ChannelServlet extends HttpServlet {
	private static final long serialVersionUID = 1L;
       
    /**
     * @see HttpServlet#HttpServlet()
     */
    public ChannelServlet() {
        super();
        // TODO Auto-generated constructor stub
    }

	/**
	 * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
	 */
	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		String level=request.getParameter("level");
		String parent =request.getParameter("parent");
		System.out.println(level);
		System.out.println(parent);
		List chlist= new ArrayList();
		if(level!=null&&level.equals("1")) {
			chlist.add(new Channel("ai","前沿/区块链/人工智能"));
			chlist.add(new Channel("web","前端/小程序/js"));
		}/*else if(level.equals("2")) {*/
		if(parent!=null&&parent.equals("ai")){
				chlist.add(new Channel("micro","微服务"));
				chlist.add(new Channel("blockchain","区块链"));
				chlist.add(new Channel("other","。。。"));
		}else if(parent!=null&&parent.equals("web")){
				chlist.add(new Channel("html","HTML"));
				chlist.add(new Channel("css","CSS"));
				chlist.add(new Channel("other","。。。"));
		}
		
		/* } */
		String json =JSON.toJSONString(chlist);
		response.setContentType("text/html;charset=UTF-8");
		response.getWriter().println(json);
	}

}

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="js/jquery-3.4.1.js"></script>
<script type="text/javascript">
$(function(){
	$.ajax({
		"url":"/ajax/channel",
		"data":{"level":"1"},
		"type":"get",
		"dataType":"json",
		"success":function(data){
			console.log(data);
			for(i=0; i<data.length;i++){
				var ch =data[i];
				$("#lv1").append("<option id='option' value='"+ch.code+"'>"+ch.name+"</option>")
			}
		}
	})
})
$(function(){
	$("#lv1").on("change",function(){
		var parent=$(this).val();
		console.log(parent);
		$.ajax({
			"url":"/ajax/channel",
			"data":{"parent":parent},
			"type":"get",
			"dataType":"json",
			"success":function(data){
				console.log(data);
				//移除所有lv2下的option
				$("#lv2>option").remove();
				for(i=0; i<data.length;i++){
					var ch =data[i];
					$("#lv2").append("<option id='option' value='"+ch.code+"'>"+ch.name+"</option>")
				}
			}
		})
	})
})
</script>
</head>
<body>
<select id="lv1" style="width:200px;height:30px">
<option id="option" selected="selected">请选择</option>
</select>
<select id="lv2" style="width:200px;height:30px"></select>
</body>
</html>

代码如上，和老师的略有不同，只是判断了一下是否为空就不会报空指针异常了。我还是比较能习惯这种思路，而且我第二个ajax 并没有再次传level，我感觉老师那种逻辑我转不过弯来。老师能否给点逻辑上的指点，本人初级开发逻辑上面有点死板，很苦恼

写回答

1回答

好帮手慕小班

2019-11-03

同学你好，1、如上代码，同学的写法也是可以的，同学是直接对level与parent进行了判断，直接对这两个参数进行判断，这样也是可以。

2、 1)、这里老师的意思是将level作为菜单级别的判断依据，这些请求都是发送到channel这个Servlet，那在这个Servlet中如何判断这些菜单的级别呐，就可以通过这些参数来判断了。

2)、这里只是一个二级菜单，如果这里是三级菜单或四级菜单呐，每一级别的菜单都有很多条数据呐，此时我们在Servlet就可以根据这个level、parent参数，来判断这是哪一级的菜单，能够更加快速的定位，这也是以后开发中常见的一种情况，例如;

 if(1){
      //一级菜单的内容
       //大类别
 }else if(2){
     //二级菜单
      //中级类别
 }else if(3){
     //三级菜单
     //小类别
 }else if(4){
     //四级菜单
     //详细信息
 }

这样就能简洁明了的的书写一个菜单的内容，并且层次分明。

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

0 学习 · 10204 问题

查看课程

相似问题

创建AJAX可以不用if判断，直接New不更好吗

回答 1

关于ajax函数的一个小问题

回答 1

老师麻烦看下我的输出的只是中括号，也没有报错，和别人的对比也是一样的结果

回答 3

回答 1

代码是否有误为什么点击下去没反应

回答 1

打开慕课网App查看更多内容