Javascript/jQuery关于JSON或数组集合的几种循环方法
JavaScript遍历JSON或数组集合:
/**
* 根据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遍历JSON集合:
/**
* Jquery遍历JSON集合
* @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;
}
|
版权声明:本文采用署名-非商业性使用-相同方式共享(CC BY-NC-SA 3.0 CN)国际许可协议进行许可,转载请注明作者及出处。 |
Javascript/jQuery关于JSON或数组集合的几种循环方法的更多相关文章
- Javascript关于JSON集合的几种循环方法
/** * 根据json数据生成option树形控件 * 如果有children节点则自动生成树形数据 * @param {JSON} data * @param {int} n 节点深度 * @pa ...
- JS数组去重的几种常见方法
JS数组去重的几种常见方法 一.简单的去重方法 // 最简单数组去重法 /* * 新建一新数组,遍历传入数组,值不在新数组就push进该新数组中 * IE8以下不支持数组的indexOf方法 * */ ...
- JavaScript监听手机物理返回键的两种解决方法
JavaScript没有监听物理返回键的API,所以只能使用 popstate 事件监听. 有两个解决办法: 1.返回到指定的页面 pushHistory(); window.addEventList ...
- jquery遍历json与数组方法总结
来自:http://www.php100.com/html/program/jquery/2013/0905/5927.html 先我们来参考each() 方法,each()规定为每个匹配元素规定运行 ...
- Javascript教程:js异步模式编程的4种解决方法
随着人们对网站视觉效果及用户体验的要求越来越高,所以在未来网站的建设中,设计师们开始越来越多的使用了js文件来达到预期的效果,随着js文件的越来越多,令设计师们最头痛的事情也就来了,那就是Javasc ...
- java数组中的三种排序方法中的冒泡排序方法
我记得我大学学java的时候,怎么就是搞不明白这三种排序方法,也一直不会,现在我有发过来学习下这三种方法并记录下来. 首先说说冒泡排序方法:冒泡排序方法就是把数组中的每一个元素进行比较,如果第i个元素 ...
- javascript;Jquery;获取JSON对象,无刷新分页,异步加载,异步删除,实例。
AjaxNewsList: <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> < ...
- javascript;Jquery;获取JSON对象,无刷新评论实例。
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> < ...
- JavaScript 字符串与json对象互转的几种方法
第一种:浏览器支持的转换方式(Firefox,chrome,opera,safari,ie)等浏览器: JSON.parse(jsonstr); //可以将json字符串转换成json对象 JSON. ...
随机推荐
- Firefox浏览器【书签工具栏】里的网址链接无法删除的解决办法
今天使用Firefox浏览器,发现有一些我从来都没有访问的网站出现在[书签工具栏], 也不知道是什么原因被添加进来的(可能是安装某个插件被插的),于是点删除,发现还删除不了,很是老火,研究了一番,把删 ...
- 前端_JQuery
使用参考:http://jquery.cuishifeng.cn/ 目录 jQuery是什么 jQuery对象 寻找元素(选择器和筛选器) 选择器 表单属性选择器 筛选器 操作元素(属性.css.文档 ...
- max number of clients reached Redis测试环境报错
现象:测试服务是去redis循环取数据,早上发现服务挂了,手动登陆redis 无法输入命令,报错:max number of clients reached Redis
- web项目中nicedit富文本编辑器的使用
web项目中nicedit富文本编辑器的使用 一.为什么要用富文本编辑器? 先说什么是富文本编辑器吧,普通的html中input或textarea标签只能进行简单的输入,而做不到其他的文本调整功能,甚 ...
- 《大象Think in UML》阅读笔记之二
Think in UML阅读笔记(二) 上一次读到面向对象和面向过程的区别和各自的优势,结合实例分析了面向过程在面对大数据的时候,已经不足以满足人们的需求,所以引入了面向对象,面向对象的方法把世界看做 ...
- WPF四则运算《《《《《策略模式
设计思路: 因为之前没有用过WPF,听说和window窗体语法类似,就想着仿照之前的Window窗体做的,首先用三个textbox存储数据,添加一个comboBox,利用索引选择运 ...
- 其实servlet就是一种mvc设计思想的一种实现
看图,不说话
- B-tree&B+tree&数据库索引原理
B-tree&B+tree:https://www.cnblogs.com/vianzhang/p/7922426.html 数据库索引原理:https://www.cnblogs.com/a ...
- Week 2
第1章:概论1.原文“这些软件企业的商业模式有些事合情合理也合法:有些看似合情合理,但不怎么合法:有些做法不合 理,但是还没有出台相关的法律.在相关法律完善之前,软件行业还有一个行规,即应该有职业道德 ...
- 13种细分类型的TCP重传小结(一张表总结4.4内核所有TCP重传场景)
具体每种重传类型的wireshark示例解说参考前文 来自为知笔记(Wiz)