引用的一个树的程序,不知道为虾米无效捏?请各位大师帮看下.^_^
JSP页面:<table width="80%" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td><script type="text/javascript" src="../js/tree.js"></script>
<script type="text/javascript">
var TREE_ITEMS = [
['频道管理','channelManage.jsp'],
];
</script>
<script type="text/javascript" src="../js/tree_tpl.js"></script>
<script type="text/javascript">
new tree (TREE_ITEMS, tree_tpl);
</script>
</td>
</tr>
</table>调用的两个JS文件:
tree.jsfunction tree (a_items, a_template) { this.a_tpl = a_template;
this.a_config = a_items;
this.o_root = this;
this.a_index = [];
this.o_selected = null;
this.n_depth = -1;
var o_icone = new Image(),
o_iconl = new Image();
o_icone.src = a_template['icon_e'];
o_iconl.src = a_template['icon_l'];
a_template['im_e'] = o_icone;
a_template['im_l'] = o_iconl;
for (var i = 0; i < 64; i++)
if (a_template['icon_' + i]) {
var o_icon = new Image();
a_template['im_' + i] = o_icon;
o_icon.src = a_template['icon_' + i];
}
this.toggle = function (n_id) { var o_item = this.a_index[n_id]; o_item.open(o_item.b_opened) };
this.select = function (n_id) { return this.a_index[n_id].select(); };
this.mout = function (n_id) { this.a_index[n_id].upstatus(true) };
this.mover = function (n_id) { this.a_index[n_id].upstatus() }; this.a_children = [];
for (var i = 0; i < a_items.length; i++)
new tree_item(this, i); this.n_id = trees.length;
trees[this.n_id] = this;
for (var i = 0; i < this.a_children.length; i++) {
document.write(this.a_children[i].init());
this.a_children[i].open();
}
}
function tree_item (o_parent, n_order) { this.n_depth = o_parent.n_depth + 1;
this.a_config = o_parent.a_config[n_order + (this.n_depth ? 2 : 0)];
if (!this.a_config) return; this.o_root = o_parent.o_root;
this.o_parent = o_parent;
this.n_order = n_order;
this.b_opened = !this.n_depth; this.n_id = this.o_root.a_index.length;
this.o_root.a_index[this.n_id] = this;
o_parent.a_children[n_order] = this; this.a_children = [];
for (var i = 0; i < this.a_config.length - 2; i++)
new tree_item(this, i); this.get_icon = item_get_icon;
this.open = item_open;
this.select = item_select;
this.init = item_init;
this.upstatus = item_upstatus;
this.is_last = function () { return this.n_order == this.o_parent.a_children.length - 1 };
}function item_open (b_close) {
var o_idiv = get_element('i_div' + this.n_id);
if (!o_idiv) return;
if (!o_idiv.innerHTML) {
var a_children = [];
for (var i = 0; i < this.a_children.length; i++)
a_children[i]= this.a_children[i].init();
o_idiv.innerHTML = a_children.join('');
}
o_idiv.style.display = (b_close ? 'none' : 'block');
this.b_opened = !b_close;
var o_jicon = document.images['j_img' + this.n_id],
o_iicon = document.images['i_img' + this.n_id];
if (o_jicon) o_jicon.src = this.get_icon(true);
if (o_iicon) o_iicon.src = this.get_icon();
this.upstatus();
}function item_select (b_deselect) {
if (!b_deselect) {
var o_olditem = this.o_root.o_selected;
this.o_root.o_selected = this;
if (o_olditem) o_olditem.select(true);
}
var o_iicon = document.images['i_img' + this.n_id];
if (o_iicon) o_iicon.src = this.get_icon();
get_element('i_txt' + this.n_id).style.fontWeight = b_deselect ? 'normal' : 'bold';
this.upstatus();
return Boolean(this.a_config[1]);
}function item_upstatus (b_clear) {
window.setTimeout('window.status="' + (b_clear ? '' : this.a_config[0] + (this.a_config[1] ? ' ('+ this.a_config[1] + ')' : '')) + '"', 10);
}function item_init () {
var a_offset = [],
o_current_item = this.o_parent;
for (var i = this.n_depth; i > 1; i--) {
a_offset[i] = '<img src="' + this.o_root.a_tpl[o_current_item.is_last() ? 'icon_e' : 'icon_l'] + '" border="0" align="absbottom">';
o_current_item = o_current_item.o_parent;
}
return '<table cellpadding="0" cellspacing="0" border="0"><tr><td nowrap>' + (this.n_depth ? a_offset.join('') + (this.a_children.length ? '<a href="javascript: trees[' + this.o_root.n_id + '].toggle(' + this.n_id + ')" onmouseover="trees[' + this.o_root.n_id + '].mover(' + this.n_id + ')" onmouseout="trees[' + this.o_root.n_id + '].mout(' + this.n_id + ')"><img src="' + this.get_icon(true) + '" border="0" align="absbottom" name="j_img' + this.n_id + '"></a>' : '<img src="' + this.get_icon(true) + '" border="0" align="absbottom">') : '') + '<a href="' + this.a_config[1] + '" target="' + this.o_root.a_tpl['target'] + '" onclick="return trees[' + this.o_root.n_id + '].select(' + this.n_id + ')" ondblclick="trees[' + this.o_root.n_id + '].toggle(' + this.n_id + ')" onmouseover="trees[' + this.o_root.n_id + '].mover(' + this.n_id + ')" onmouseout="trees[' + this.o_root.n_id + '].mout(' + this.n_id + ')" class="t' + this.o_root.n_id + 'i" id="i_txt' + this.n_id + '"><img src="' + this.get_icon() + '" border="0" align="absbottom" name="i_img' + this.n_id + '" class="t' + this.o_root.n_id + 'im">' + this.a_config[0] + '</a></td></tr></table>' + (this.a_children.length ? '<div id="i_div' + this.n_id + '" style="display:none"></div>' : '');
}function item_get_icon (b_junction) {
//alert('icon_' + ((this.n_depth ? 0 : 32) + (this.a_children.length ? 16 : 0) + (this.a_children.length && this.b_opened ? 8 : 0) + (!b_junction && this.o_root.o_selected == this ? 4 : 0) + (b_junction ? 2 : 0) + (b_junction && this.is_last() ? 1 : 0)));
return this.o_root.a_tpl['icon_' + ((this.n_depth ? 0 : 32) + (this.a_children.length ? 16 : 0) + (this.a_children.length && this.b_opened ? 8 : 0) + (!b_junction && this.o_root.o_selected == this ? 4 : 0) + (b_junction ? 2 : 0) + (b_junction && this.is_last() ? 1 : 0))];
}var trees = [];
get_element = document.all ?
function (s_id) { return document.all[s_id] } :
function (s_id) { return document.getElementById(s_id) };tree_tpl.jsvar tree_tpl = {
'target' : 'mainFrame', // name of the frame links will be opened in
// other possible values are: _blank, _parent, _search, _self and _top 'icon_e' : 'images/empty.gif', // empty image
'icon_l' : 'images/line.gif', // vertical line 'icon_32' : 'images/base.gif', // root icon normal
'icon_36' : 'images/base.gif', // root icon normal
'icon_48' : 'images/base.gif', // root icon normal
'icon_52' : 'images/base.gif', // root icon selected
'icon_56' : 'images/base.gif', // root icon opened
'icon_60' : 'images/base.gif', // root icon selected
'icon_16' : 'images/folder.gif', // node icon normal
'icon_20' : 'images/folderopen.gif', // node icon selected
'icon_24' : 'images/folder.gif', // node icon opened
'icon_28' : 'images/folderopen.gif', // node icon selected opened 'icon_0' : 'images/page.gif', // leaf icon normal
'icon_4' : 'images/page.gif', // leaf icon selected
'icon_8' : 'images/page.gif', // leaf icon opened
'icon_12' : 'images/page.gif', // leaf icon selected
'icon_2' : 'images/joinbottom.gif', // junction for leaf
'icon_3' : 'images/join.gif', // junction for last leaf
'icon_18' : 'images/plusbottom.gif', // junction for closed node
'icon_19' : 'images/plus.gif', // junctioin for last closed node
'icon_26' : 'images/minusbottom.gif',// junction for opened node
'icon_27' : 'images/minus.gif' // junctioin for last opended node
};
JSP页面:<table width="80%" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td><script type="text/javascript" src="../js/tree.js"></script>
<script type="text/javascript">
var TREE_ITEMS = [
['频道管理','channelManage.jsp'],
];
</script>
<script type="text/javascript" src="../js/tree_tpl.js"></script>
<script type="text/javascript">
new tree (TREE_ITEMS, tree_tpl);
</script>
</td>
</tr>
</table>调用的两个JS文件:
tree.jsfunction tree (a_items, a_template) { this.a_tpl = a_template;
this.a_config = a_items;
this.o_root = this;
this.a_index = [];
this.o_selected = null;
this.n_depth = -1;
var o_icone = new Image(),
o_iconl = new Image();
o_icone.src = a_template['icon_e'];
o_iconl.src = a_template['icon_l'];
a_template['im_e'] = o_icone;
a_template['im_l'] = o_iconl;
for (var i = 0; i < 64; i++)
if (a_template['icon_' + i]) {
var o_icon = new Image();
a_template['im_' + i] = o_icon;
o_icon.src = a_template['icon_' + i];
}
this.toggle = function (n_id) { var o_item = this.a_index[n_id]; o_item.open(o_item.b_opened) };
this.select = function (n_id) { return this.a_index[n_id].select(); };
this.mout = function (n_id) { this.a_index[n_id].upstatus(true) };
this.mover = function (n_id) { this.a_index[n_id].upstatus() }; this.a_children = [];
for (var i = 0; i < a_items.length; i++)
new tree_item(this, i); this.n_id = trees.length;
trees[this.n_id] = this;
for (var i = 0; i < this.a_children.length; i++) {
document.write(this.a_children[i].init());
this.a_children[i].open();
}
}
function tree_item (o_parent, n_order) { this.n_depth = o_parent.n_depth + 1;
this.a_config = o_parent.a_config[n_order + (this.n_depth ? 2 : 0)];
if (!this.a_config) return; this.o_root = o_parent.o_root;
this.o_parent = o_parent;
this.n_order = n_order;
this.b_opened = !this.n_depth; this.n_id = this.o_root.a_index.length;
this.o_root.a_index[this.n_id] = this;
o_parent.a_children[n_order] = this; this.a_children = [];
for (var i = 0; i < this.a_config.length - 2; i++)
new tree_item(this, i); this.get_icon = item_get_icon;
this.open = item_open;
this.select = item_select;
this.init = item_init;
this.upstatus = item_upstatus;
this.is_last = function () { return this.n_order == this.o_parent.a_children.length - 1 };
}function item_open (b_close) {
var o_idiv = get_element('i_div' + this.n_id);
if (!o_idiv) return;
if (!o_idiv.innerHTML) {
var a_children = [];
for (var i = 0; i < this.a_children.length; i++)
a_children[i]= this.a_children[i].init();
o_idiv.innerHTML = a_children.join('');
}
o_idiv.style.display = (b_close ? 'none' : 'block');
this.b_opened = !b_close;
var o_jicon = document.images['j_img' + this.n_id],
o_iicon = document.images['i_img' + this.n_id];
if (o_jicon) o_jicon.src = this.get_icon(true);
if (o_iicon) o_iicon.src = this.get_icon();
this.upstatus();
}function item_select (b_deselect) {
if (!b_deselect) {
var o_olditem = this.o_root.o_selected;
this.o_root.o_selected = this;
if (o_olditem) o_olditem.select(true);
}
var o_iicon = document.images['i_img' + this.n_id];
if (o_iicon) o_iicon.src = this.get_icon();
get_element('i_txt' + this.n_id).style.fontWeight = b_deselect ? 'normal' : 'bold';
this.upstatus();
return Boolean(this.a_config[1]);
}function item_upstatus (b_clear) {
window.setTimeout('window.status="' + (b_clear ? '' : this.a_config[0] + (this.a_config[1] ? ' ('+ this.a_config[1] + ')' : '')) + '"', 10);
}function item_init () {
var a_offset = [],
o_current_item = this.o_parent;
for (var i = this.n_depth; i > 1; i--) {
a_offset[i] = '<img src="' + this.o_root.a_tpl[o_current_item.is_last() ? 'icon_e' : 'icon_l'] + '" border="0" align="absbottom">';
o_current_item = o_current_item.o_parent;
}
return '<table cellpadding="0" cellspacing="0" border="0"><tr><td nowrap>' + (this.n_depth ? a_offset.join('') + (this.a_children.length ? '<a href="javascript: trees[' + this.o_root.n_id + '].toggle(' + this.n_id + ')" onmouseover="trees[' + this.o_root.n_id + '].mover(' + this.n_id + ')" onmouseout="trees[' + this.o_root.n_id + '].mout(' + this.n_id + ')"><img src="' + this.get_icon(true) + '" border="0" align="absbottom" name="j_img' + this.n_id + '"></a>' : '<img src="' + this.get_icon(true) + '" border="0" align="absbottom">') : '') + '<a href="' + this.a_config[1] + '" target="' + this.o_root.a_tpl['target'] + '" onclick="return trees[' + this.o_root.n_id + '].select(' + this.n_id + ')" ondblclick="trees[' + this.o_root.n_id + '].toggle(' + this.n_id + ')" onmouseover="trees[' + this.o_root.n_id + '].mover(' + this.n_id + ')" onmouseout="trees[' + this.o_root.n_id + '].mout(' + this.n_id + ')" class="t' + this.o_root.n_id + 'i" id="i_txt' + this.n_id + '"><img src="' + this.get_icon() + '" border="0" align="absbottom" name="i_img' + this.n_id + '" class="t' + this.o_root.n_id + 'im">' + this.a_config[0] + '</a></td></tr></table>' + (this.a_children.length ? '<div id="i_div' + this.n_id + '" style="display:none"></div>' : '');
}function item_get_icon (b_junction) {
//alert('icon_' + ((this.n_depth ? 0 : 32) + (this.a_children.length ? 16 : 0) + (this.a_children.length && this.b_opened ? 8 : 0) + (!b_junction && this.o_root.o_selected == this ? 4 : 0) + (b_junction ? 2 : 0) + (b_junction && this.is_last() ? 1 : 0)));
return this.o_root.a_tpl['icon_' + ((this.n_depth ? 0 : 32) + (this.a_children.length ? 16 : 0) + (this.a_children.length && this.b_opened ? 8 : 0) + (!b_junction && this.o_root.o_selected == this ? 4 : 0) + (b_junction ? 2 : 0) + (b_junction && this.is_last() ? 1 : 0))];
}var trees = [];
get_element = document.all ?
function (s_id) { return document.all[s_id] } :
function (s_id) { return document.getElementById(s_id) };tree_tpl.jsvar tree_tpl = {
'target' : 'mainFrame', // name of the frame links will be opened in
// other possible values are: _blank, _parent, _search, _self and _top 'icon_e' : 'images/empty.gif', // empty image
'icon_l' : 'images/line.gif', // vertical line 'icon_32' : 'images/base.gif', // root icon normal
'icon_36' : 'images/base.gif', // root icon normal
'icon_48' : 'images/base.gif', // root icon normal
'icon_52' : 'images/base.gif', // root icon selected
'icon_56' : 'images/base.gif', // root icon opened
'icon_60' : 'images/base.gif', // root icon selected
'icon_16' : 'images/folder.gif', // node icon normal
'icon_20' : 'images/folderopen.gif', // node icon selected
'icon_24' : 'images/folder.gif', // node icon opened
'icon_28' : 'images/folderopen.gif', // node icon selected opened 'icon_0' : 'images/page.gif', // leaf icon normal
'icon_4' : 'images/page.gif', // leaf icon selected
'icon_8' : 'images/page.gif', // leaf icon opened
'icon_12' : 'images/page.gif', // leaf icon selected
'icon_2' : 'images/joinbottom.gif', // junction for leaf
'icon_3' : 'images/join.gif', // junction for last leaf
'icon_18' : 'images/plusbottom.gif', // junction for closed node
'icon_19' : 'images/plus.gif', // junctioin for last closed node
'icon_26' : 'images/minusbottom.gif',// junction for opened node
'icon_27' : 'images/minus.gif' // junctioin for last opended node
};
解决方案 »
- websphere6.0下部署war包,异常javax.naming.NameNotFoundException: Namenotfound java:
- 你是大侠吗?是的话进来坐坐吧!
- JSF的EL表达式可以嵌套吗?action="#{menu.navigation}"
- 怎么用正则表达式表示 0到10000的整数?
- 验证码字库.............................
- An unexpected exception has been detected in native code outside the VM
- 请问为什么我禁用了cookie以后,就不能得到session值呢??????
- 急~页面提交问题(100分)!
- 100分!数据库连接数过多,怎样限制?在线等,急用!
- 文本区如何进行编辑?现在文本区不支持VALUE属性!
- 项目里面有时候报这个错有时候不报,可把我愁坏了Cannot forward after response has been committed
- 关于jsp读取数据库图片的问题
相对路径与绝对路径的问题 你jsp页面有 得到相对路径的方法没把路径写死测试下
不要放在table标签中,应该放到body标签以外,
其次当你不知道路径的时候建议这样写:
"<script type="text/javascript" src="<%=request.getContextPath() %>/js/tree.js"></script>"
"<script type="text/javascript" src="${pageContext.requset.contextPath}/js/tree.js"></script>"
首页有一些需要特效的版块都是这样完成的...都冒问题...
行:47
Char:5
错误:'TREE_ITEM'is undefined
代码:0
URL:HTTP://LOCALHOST....../FUNCTIONLIST.JSP
发现楼上说说的js文件的编码问题,我试试另存为了UTF-8格式,结果可以了。
感谢9楼!!!!!!!!!!!