<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<title>在下拉列表中显示的多级树形菜单</title>

<meta http-equiv="content-type" content="text/html;charset=gb2312">

<script type="text/javascript">

var data =new Array();

data[]= {id:'',pid:'',text:'河北'};

data[]= {id:'',pid:'-1',text:'中国'};

data[]= {id:'',pid:'',text:'莫斯科'};

data[]= {id:'',pid:'',text:'河南'};

data[]= {id:'',pid:'',text:'北京'};

data[]= {id:'',pid:'',text:'湖南'};

data[]= {id:'',pid:'-1',text:'俄罗斯'};

function TreeSelector(item,data,rootId){

this._data = data;

this._item = item;

this._rootId = rootId;

}

TreeSelector.prototype.createTree = function(){

var len =this._data.length;

for( var i= ;i<len;i++){

if ( this._data[i].pid == this._rootId){

this._item.options.add(new Option(".."+this._data[i].text,this._data[i].id));

for(var j=;j<len;j++){

this.createSubOption(len,this._data[i],this._data[j]);

}

}

}

}

TreeSelector.prototype.createSubOption = function(len,current,next){

var blank = "..";

if ( next.pid == current.id){

intLevel =;

var intlvl =this.getLevel(this._data,this._rootId,current);

for(a=;a<intlvl;a++)

blank += "..";

blank += "├-";

this._item.options.add(new Option(blank + next.text,next.id));

for(var j=;j<len;j++){

this.createSubOption(len,next,this._data[j]);

}

}

}

TreeSelector.prototype.getLevel = function(datasources,topId,currentitem){

var pid =currentitem.pid;

if( pid !=topId)

{

for(var i = ;i<datasources.length;i++)

{

if( datasources[i].id == pid)

{

intLevel ++;

this.getLevel(datasources,topId,datasources[i]);

}

}

}

return intLevel;

}

</script>

</head>

<body>

<select id="myselect"></select>

<script language=javascript type="text/javascript">

var ts = new TreeSelector(document.getElementById("myselect"),data,-);

ts.createTree();

</script>

</body>

</html>

Select显示多级分类列表的更多相关文章

  1. 在DropDownList里显示多级分类

    protected void ddlBind() { DataTable dt = new DataTable(); ddlCategoryId.DataSource = getList(" ...

  2. Hexo主题实现多级分类显示

    前言 最近在搞一个博客,是托管在github和gitcafe上的,利用Hexo生成的.之后,发现一个问题,显示的分类都是一级的.而我想要的是:能显示多级分类,层次分明`的那样. 问题 基本主题自带的分 ...

  3. WordPress分类列表函数:wp_list_categories用法及参数详解举例

    http://www.511yj.com/wordpress-wp-categories.html 注意: 1. wp_list_categories() 和 list_cats() 以及 wp_li ...

  4. magento简化url多级分类去掉父目录

    在Magento模板开发中,有时候需要将多级分类的url简化,Magento的URL默认是显示多级分类的http://afish.cnblogs.com/分类1/分类2/分类3现在需要简化为:分类2的 ...

  5. 在Vue中使用iview的Select控件实现一个多级选项列表

    前言 今天项目要实现一个多级选项列表,发现iview官网上没有写这个例子,于是自己就实现了,如果对你有帮助请点个赞 ‘ * ’!! 解决方法:下面我们就来使用V-for 来定义一个二级选项列表 ,代码 ...

  6. SQLite中使用CTE巧解多级分类的级联查询

    在最近的项目中使用ActiveReports报表设计器设计一个报表模板时,遇到一个多级分类的难题:需要将某个部门所有销售及下属部门的销售金额汇总,因为下属级别的层次不确定,所以靠拼接子查询的方式显然是 ...

  7. ECSHOP任意页面显示指定分类、数量、排序的任意类型文章，包括只显示置顶or普通的文章

    1.在需要使用此功能的PHP页面里最后的?>前面添加以下代码,现在以article.php为例子 /** jinmozhe 专业ECSHOP二次开发 * 获得指定分类ID.文章类型.指定数量.排 ...

  8. EXCEL中多级分类汇总空白字段填充

    使用场景,多级分类汇总后,在汇总的字段中显示空白,这样对我们直接取值做表带来十分不更(假像有5000条记录,1000条汇总项) 相关技术,INDIRECT函数,单元格定位功能. 在数据区域外任意一个单 ...

  9. 常用分类列表wp_list_categories()

    使用: <ul> <?php $args= array( 'depth'=>1, 'orderby'=>id, 'style'=>none ); wp_list_c ...

随机推荐

  1. 更改 pandas dataframe 中两列的位置

    更改 pandas dataframe 中两列的位置: 把其中的某列移到第一列的位置. 原来的 df 是: df = pd.read_csv('I:/Papers/consumer/codeandpa ...

  2. 网络工程实训_4RIP路由（动态路由）

    实验4:RIP路由.包括RIPv1:RIPv2 动态路由协议包括距离向量路由协议和链路状态路由协议.RIP(Routing Information Protocol,路由信息协议)是使用最广泛的距离向 ...

  3. 调试解决iOS内存泄漏

    这里讲述在没有ARC的情况下,如何使用Instruments来查找程序中的内存泄露,以及NSZombieEnabled设置的使用. 本文假设你已经比较熟悉Obj-C的内存管理机制. 实验的开发环境:X ...

  4. iOS - UIPasteboard

    前言 NS_CLASS_AVAILABLE_IOS(3_0) __TVOS_PROHIBITED __WATCHOS_PROHIBITED @interface UIPasteboard : NSOb ...

  5. OAF_OAF组件系列1 - Item Style汇总（概念）

    20150506 Created By BaoXinjian

  6. Android调试技巧之Eclipse行号和Logcat

    很多初入Android的开发者可能会发现经常遇到Force Close或ANR这样的问题,一般我们通过Android系统的错误日志打印工具Logcat可以看到出错的内容,今天一起来说下如何通过 Ecl ...

  7. 检测到 Mac 文件格式: 请将源文件转换为 DOS 格式或 UNIX 格式

    非常简单可以解决: 方法一,用editplus打开,再复制回VS 方法二:在VS中,点文件->高级保存选项,然后在行尾选项中选择windows(CR LF),重新编译,ok

  8. mysql特殊语句学习

    一.Mysql ON子句和USING子句 Mysql 中联接SQL语句中,ON子句的语法格式为:table1.column_name = table2.column_name. 当模式设计对联接表的列 ...

  9. Racket 版本的 24 点实现

    Racket 版本的 24 点实现 #lang racket ; Author: woodfox ; Date: Oct 11, 2014 ; ==================== 1. Non- ...

  10. Mac中提升权限修改系统目录

    原来OSX EI Capitan中增加了一个SIP功能,不管你是不是su,都会阻止你在系统目录下进行操作.如果,想要修改系统目录的文件,如升级bash,需要修改/bin/bash,那么就要先关闭SIP ...