下拉树(下拉页面)的实现
这几天看到又有人用这个下拉树了,没有及时解答,深感抱歉,现将最新使用的源码贡献出来,希望能帮助那些有需要的人。
最近项目中要用到下拉多选树,有人从网上找了一个,用了一段时间后发现有一些问题,一个页面中只能有一个下拉树,我就研究其中的代码,自己重新写了一个下拉页面的脚本,能够在一个页面中使用多个下拉树。
其原理其实就是用DIV的隐藏的显示来实现下拉页面,页面放在了DIV里的一个FRAME里,用JS来控制这些显示与隐藏,废话不多说了,把源码给大家公布一下。代码中如有不足之处敬请大家指出。
给大家说一下它的用法,首先在页面里加上JS文件:
在需要下拉树的地方写一个DIV:
JS里用到了两个图片,你可以把这两个图片放到主页面同一层的路径下,或者直接修改JS源文件,把它指向你自己的路径。
目标页面需要加一些东西,写一个函数:
function getUserData(tag){
var ids = tree1.getAllChecked();
if(ids.length==0)return "";
if(tag=="id")
return tree1.getAllChecked();
else if(tag=="name"){
var idArray = ids.split(",");
var names=tree1.getItemText(idArray[0]);
for(i=1;
inames += "," + tree1.getItemText(idArray[i]);
return names;
}
}
其中的返回值可以根据你的页面要实现的功能改动。
在页面中需要用到树的地方这样写:
这个函数中的参数给大家详细解释一下,
存储名字的字段名,(id或name都行,如果你的主页面里没有这样的字段,JS会帮你创建它);
存储ID的字段名,
树的类型,
树中加的参数,
显示下拉树的宽度(可以用html语言中的宽度来表示)
【下拉树(下拉页面)的实现】
推荐阅读
- 【生信技能树】R语言练习题|【生信技能树】R语言练习题 - 中级
- java中如何实现重建二叉树
- tableView|tableView 头视图下拉放大 重写
- 种树郭橐驼传(文言句式+古今异义+词类活用+通假字)
- 白杨树
- 08黑龙江迟淑荣弯柳树网络学院第五期学习赵宗瑞老师主讲的(传统文化与身心健康)教育体系心得体会
- [原创]能见沂山一棵树,胜读十年无用书!
- 分享!如何分分钟实现微信扫二维码调用外部浏览器打开指定页面的功能
- 涵养字外功
- 2018.07.07《刺杀骑士团长》村上春树