昨天做了个菜单树,通过dTree生成。
先在后台对dTree格式的JS树形结构进行拼接,然后再通过AJAX请求返回到前台JSP页面中,可是到了JSP页面中之后有那棵树,但是就是不能显示,这问题一直困恼了我一下午,真是百思不得其解啊。在网上找了很多资料,但是看的我是雾里云里,就在快要放弃另选途径的时候天空一阵巨响,答案闪亮登场。具体做法如下:
1、在前台JSP页面的BODY中编写了一个DIV:<div id="menuTreeFrame"></div>
2、通过AJAX提交:
//通过ajax提交
function ajaxSub(){
$.ajax({
url:"/remoteSale/mdspsys00001/menu/",
type:"post",
data:"type=tree",
success:function(transport){
document.getElementById('menuTreeFrame').innerHTML= transport;
//转换JS的方法
executeScript(transport);
},
error:function(){
}
});
}
3、重点是那个JS的转换方法
function executeScript(html)
{
var reg = /<script[^>]*>([^\x00]+)$/i;
//对整段HTML片段按<\/script>拆分
var htmlBlock = html.split("<\/script>");
for (var i in htmlBlock)
{
var blocks;//匹配正则表达式的内容数组,blocks[1]就是真正的一段脚本内容,因为前面reg定义我们用了括号进行了捕获分组
if (blocks = htmlBlock[i].match(reg))
{
//清除可能存在的注释标记,对于注释结尾-->可以忽略处理,eval一样能正常工作
var code = blocks[1].replace(/<!--/, '');
try
{
eval(code); //执行脚本
}
catch (e)
{
}
}
}
}
最后,通过“eval(code)”对此JS执行,JSP页面中DIV名称为“menuTreeFrame”进行展现你所需要的内容啦!!!
注意:貌似不能展示出JS所需要的效果,只能简单的显示成一棵树以及所需的图片,而连最起码的“展现”与“收缩”功能都没有,哎!
今天终于通过自己的不懈努力写出了自己所需的完美的菜单树,稍后会编写给大家!!