这里左侧菜单栏,跟右边的列表,详细信息,每次点击都同时刷新,每次菜单栏都闭合,所以就想了如此办法:首先一开始用的Java写的HTML标签如下,利用递归查出所有菜单
menuString.append("<a id="+parent.getId()+" onClick=\"jump('"+href+"','"+parent.getId()+"');\"><i class=\"fa "+parent.getIcon()+"\">
</i> <span class=\"nav-label\">"+parent.getName()+"</span></a>");在左侧菜单jsp文件里将parent.getId()获取保存起来,这里保存如下利用HTML5特性
<script type="text/javascript">
$(document).ready(function(){
var getId=localStorage.getItem("id");
$("#"+getId).parent().addClass("active");//增加高亮度
$("#"+getId).parent().parent().parent().addClass("active");//负责展开
//这里的首页暂时没做,所以先这样判断,等后面做了,就不需要这些了
if (getId !=null){
$("#index").removeClass("active");
}
});
function jump(href,id){
var localStorage=window.localStorage;
localStorage.setItem("id",id);
window.location.href=href;
}
</script>
//这个类遍历所有菜单,包括一级,二级
public class MenuTag extends TagSupport {
private static final long serialVersionUID = 1L;
protected Menu menu;//菜单Map
public Menu getMenu() {
return menu;
}
public void setMenu(Menu menu) {
this.menu = menu;
}
public int doStartTag() throws JspTagException {
return EVAL_PAGE;
}
public int doEndTag() throws JspTagException {
try {
JspWriter out = this.pageContext.getOut();
String menu = (String) this.pageContext.getSession().getAttribute("menu");
if(menu!=null){
out.print(menu);
}else{
menu=end().toString();
out.print(menu);
}
} catch (IOException e) {
e.printStackTrace();
}
return EVAL_PAGE;
}
public StringBuffer end() {
StringBuffer sb = new StringBuffer();
sb.append(getChildOfTree(menu,0, UserUtils.getMenuList()));
System.out.println(sb);
return sb;
}
private static String getChildOfTree(Menu parent, int level, List<Menu> menuList) {
StringBuffer menuString = new StringBuffer();
String href = "";
if (!parent.hasPermisson())
return "";
if (level > 0) {//level 为0是功能菜单
menuString.append("<li>");
ServletContext context = SpringContextHolder
.getBean(ServletContext.class);
if (parent.getHref() != null && parent.getHref().length() > 0) {
if (parent.getHref().startsWith("http://")) {// 如果是互联网资源
href = parent.getHref();
} else if(parent.getHref().endsWith(".html")&&!parent.getHref().endsWith("ckfinder.html")){//如果是静态资源并且不是ckfinder.html,直接访问不加adminPath
href = context.getContextPath() + parent.getHref();
}else{
href = context.getContextPath() + Global.getAdminPath()
+ parent.getHref();
}
}
}
if ((parent.getHref() == null || parent.getHref().trim().equals("")) && parent.getIsShow().equals("1")) {//如果是父节点且显示
if (level > 0) {
menuString
.append("<a href=\""
+ href
+ "\"><i class=\"fa "+parent.getIcon()+"\"></i> <span class=\"nav-label\">"
+ parent.getName()
+ "</span><span class=\"fa arrow\"></span></a>");
}
if (level == 1) {
menuString.append("<ul class=\"nav nav-second-level\">");
} else if (level == 2) {
menuString.append("<ul class=\"nav nav-third-level\">");
} else if (level == 3) {
menuString.append("<ul class=\"nav nav-forth-level\">");
} else if (level == 4) {
menuString.append("<ul class=\"nav nav-fifth-level\">");
}
for (Menu child : menuList) {
if (child.getParentId().equals(parent.getId())&&child.getIsShow().equals("1")) {
menuString.append(
getChildOfTree(child, level + 1, menuList));
}
}
if (level > 0) {
menuString.append("</ul>");
}
} else {
/*menuString.append("<a class=\"J_menuItem\" href=\"" + href
+ "\" ><i class=\"fa "+parent.getIcon()+"\"></i> <span class=\"nav-label\">"+parent.getName()+"</span></a>");*/
menuString.append("<a id="+parent.getId()+" onClick=\"jump('"+href+"','"+parent.getId()+"');\"><i class=\"fa "+parent.getIcon()+"\"></i> <span class=\"nav-label\">"+parent.getName()+"</span></a>");
}
if (level > 0) {
menuString.append("</li>");
}
return menuString.toString();
}
}
本文探讨了左侧菜单栏与右侧列表同步刷新的问题,提出了一种解决方案:通过Java实现HTML标签的递归遍历,确保点击二级菜单时仅展开而不全页面刷新,以提升用户体验。
994

被折叠的 条评论
为什么被折叠?



