/**
* 根据json数据生成option树形控件
* 如果有children节点则自动生成树形数据
* @param {JSON} data
* @param {int} n 节点深度
* @param {string} char 节点名称前缀
* @returns {string}
* @since 1.0 2014-8-22 by sutroon
* @example
* var data = (typeof (data) == "object") ? data : $.parseJSON(data);
* var str = '';
* str=generate_options(data);
*/
function generate_options(data, n, char) {
if (n == undefined) {
n = 0;
}
if (char == undefined) {
char = '..';
}
var pad = '';
while (n > 0) {
pad += char;
n--;
}
var str = '';
if (data.length) {
// 多行格式
for (var i = 0; i < data.length; i++) {
if (data[i].id) {
// 用于[{"id":"1","name":"name1"}]格式
str += '<option value="' + data[i].id + '">' + pad + (data[i].name ? data[i].name : data[i].text) + '</option>';
} else if (data[i].item) {
// 用于[{"item":"1"},{"item":"2"}]
str += '<option value="' + data[i].item + '">' + pad + data[i].item + '</option>';
} else {
// 用于["item1","item2"]格式
str += '<option value="' + data[i] + '">' + pad + data[i] + '</option>';
}
if (data[i].children) {
str += generate_options(data[i].children, n + 1, char);
}
}
}
else {
// 用于{"a":"a1","b":"b2"}单行格式
for (var attr in data) {
str += '<option value="' + attr + '">' + data[attr] + '</option>';
}
}
return str;
} ======================================================补充Jquery版本=====================
/**
* Jquery版
* @param JSON或Array data
* @param integer n
* @param string char
* @returns string
* @since 1.0 <2015-6-11> SoChishun Added.
* @example
alert(generate_options([{"id": "1", "name": "name1"}]));
alert(generate_options([{"item": "1"}, {"item": "2"}]));
alert(generate_options(["item1", "item2"]));
alert(generate_options({"a": "a1", "b": "b2"}));
*/
function generate_options(data, n, char) {
if (n == undefined) {
n = 0;
}
if (char == undefined) {
char = '..';
}
var pad = '';
while (n > 0) {
pad += char;
n--;
}
var str = '';
if ($.isArray(data)) {
// 多行格式
$.each(data, function () {
if (this.id) {
// 用于[{"id":"1","name":"name1"}]格式
str += '<option value="' + this.id + '">' + pad + (this.name ? this.name : this.text) + '</option>';
} else if (this.item) {
// 用于[{"item":"1"},{"item":"2"}]
str += '<option value="' + this.item + '">' + pad + this.item + '</option>';
} else {
// 用于["item1","item2"]格式
str += '<option value="' + this + '">' + pad + this + '</option>';
}
if (this.children) {
str += generate_options(this.children, n + 1, char);
}
})
}
else {
if ($.isPlainObject(data)) {
// 用于{"a":"a1","b":"b2"}单行格式
$.each(data, function (key) {
str += '<option value="' + key + '">' + this + '</option>';
})
}
}
return str;
}

 

版权声明:本文原著天澜(14507247#qq.com),版权遵循知识共享许可协议[查看]。您可自由转载收藏,但请留此声明,感谢!

Javascript关于JSON集合的几种循环方法的更多相关文章

  1. Javascript/jQuery关于JSON或数组集合的几种循环方法

    JavaScript遍历JSON或数组集合: /** * 根据json数据生成option树形控件 * 如果有children节点则自动生成树形数据 * @param {JSON} data * @p ...

  2. js自动轮播图片的两种循环方法(原创)

    用5个div,布局从左到右5张图片,从左到右5个div分别指定ID为img1,img2,img3,img4,img5.(背景是relative,5个div是相对于背景absolute定位) 显示如下: ...

  3. Javascript跨域请求的几种解决方法

    什么情况下才会出现跨域? 假设域名是:http://www.example.com.cn/ 如果所请求的域名跟这个域名不致,这种情况就是跨域,由于跨域存在漏洞,所以一般来说正常的跨域请求方式是请求不到 ...

  4. js------10种循环方法

    let arr = [{a:1},{a:2},{a:3},{a:4},{a:5}]; // 1.while循环 let sum = 0; let num = 1; while(num <= 1) ...

  5. Collection集合的三种初始化方法

    (一) java容器可以分为两大类 1)Collection其中包括List,Set,Queue 2)Map (二) Arrays.asList()方法:接受一个数组或一个逗号分隔的元素列表,并将其转 ...

  6. JavaScript里的循环方法总结

    JavaScript诞生已经有20多年了,我们一直使用的用来循环一个数组的方法是这样的: for (var index = 0; index < myArray.length; index++) ...

  7. JavaScript里的循环方法之forEach,for-in,for-of

    JavaScript一种直译式脚本语言,是一种动态类型.弱类型.基于原型的语言,内置支持类型.它的解释器被称为JavaScript引擎,为浏览器的一部分,广泛用于客户端的脚本语言,最早是在HTML(标 ...

  8. JavaScript里的循环方法:forEach,for-in,for-of

    JavaScript诞生已经有20多年了,我们一直使用的用来循环一个数组的方法是这样的: for (var index = 0; index < myArray.length; index++) ...

  9. java中的循环方法(附带本人遇到的坑)

    java循环结构 顺序结构的程序语句只能 被执行一次.如果你要同样的操作执行多次,就需要使用循环结构. java中有三种主要的循环结构: 1.while 循环 2.do...while 循环 3.fo ...

随机推荐

  1. eas之单据转换规则

    /**  * BOTP单据转换  * @param botpNum 转换规则编号  * @param BillInfo 原单据  */ public static void BOTP(String b ...

  2. 15.5.5 【Task实现细节】围绕 await 表达式的控制

    任何 await 表达式均表示执行路径的一个分支.首先,被等待的异步操作得到一个awaiter,然后检查其 IsCompleted 属性.若返回 true ,即可立即获得结果并继续.否则,需进行以下处 ...

  3. html第七节课

    document 1.Window.document对象 一.找到元素: docunment.getElementById("id"):根据id找,最多找一个:    var a ...

  4. html第三节课

    表单 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.o ...

  5. SQL中的条件判断语句(case when zhen if,ifnull)用法

    简介: case具有两种格式.简单case函数和case搜索函数.这两种方式,可以实现相同的功能.简单case函数的写法相对比较简洁,但是和case搜索函数相比,功能方面会有些限制,比如写判定式.还有 ...

  6. linux 中,mysql数据库备份操作

    1.新建一个sh脚本(可以先建一个txt文本,然后改为sh文件). 代码如下: #!/bin/bash #设置mysql备份目录 folder=/**/** cd $folder day=`date ...

  7. python第十一周:RabbitMQ、Redis

    Rabbit Mq消息队列 RabbitMQ能为你做些什么? 消息系统允许软件.应用相互连接和扩展.这些应用可以相互链接起来组成一个更大的应用,或者将用户设备和数据进行连接.消息系统通过将消息的发送和 ...

  8. C++ 类型转化(运算符重载函数)和基本运算符重载(自增自减)

    类型转化(运算符重载函数) 用转换构造函数可以将一个指定类型的数据转换为类的对象.但是不能反过来将一个类的对象转换为一个其他类型的数据(例如将一个Complex类对象转换成double类型数据).在C ...

  9. 1. 构建第一个SpringBoot工程

    1.File -  New - Module 2.选项的是Spring Initializr(官方的构建插件,需要联网) ,一定要选择jdk 3.填写项目基本信息 Group:组织ID,一般分为多个段 ...

  10. windows 下 logstash 安装启动

    最新在研究elastic stack (elk)  : logstash 安装,下载最新版本的logstash: 点击打开链接 解压到磁盘根目录下:在logstash>bin 1.目录下创建:l ...