JS 无限级 Select效果实现代码(json格式)
演示地址: http://demo.jb51.net/js/2011/js_select/index.htm
数据
代码如下:
var data=[
{id:1,name:"前端开发",pid:0},
{id:2,name:"CSS",pid:1},
{id:3,name:"JS",pid:1},
{id:4,name:"HTML",pid:1},
{id:5,name:"数据库",pid:0},
{id:6,name:"SQLServer",pid:5},
{id:7,name:"MYSql",pid:5},
{id:8,name:"Oracle",pid:5},
{id:9,name:"PLSQL",pid:8}
];
var demo1=Doc.Get("demo1");
var chg=function(obj){
if(obj.options.length>1){
obj.selectedIndex=0;
demo1.appendChild(obj);
}
}
var sel1=new Select(data,chg);
var _arr=sel1.getDom();
for(var i=0;i<_arr.length;i++){
demo1.appendChild(_arr[i]);
}
var demo2=Doc.Get("demo2");
var chg=function(obj){
if(obj.options.length>1){
obj.selectedIndex=0;
demo2.appendChild(obj);
}
}
var sel=new Select(data,chg);
var _arr=sel.getDom(9);
for(var i=0;i<_arr.length;i++){
demo2.appendChild(_arr[i]);
}
相关推荐
-
json格式化/压缩工具 Chrome插件扩展版
安装方法:用chrome浏览器访问 https://chrome.google.com/extensions/detail/pjkoglpbigbjijmncfkcpkcpddnelgbm?hl=zh-cn [json格式化/压缩]工具 chrome下安装 :) 1.建一个新的文件夹 2.建一个名为 manifest.json的文件 3.打开这个 manifest.json文件,可以理解为配置文件 :) 包含以下内容 复制代码 代码如下: { "name": "My Firs
-
JS对象与JSON格式数据相互转换
目前的项目数据交互几乎都用JQuery,所以处理流程是:前端页面数据->JS对象->jQuery提交->python处理,另外一种就是倒过来.python肯定不能直接处理JS对象数据,所以要把JS对象转换成为python能处理的一种数据格式(通常是字典dict),同样,python取数据反馈到前端也要把字典数据转换成JS能处理的对象,这个中间转换数据格式通常就是JSON. 一.JS对象转换成为JSON 流程:读取前端页面数据,组装成为JS对象,并通过jQuery的$.post()方法传递
-
数据类型和Json格式分析小结
1. 前几天,我才知道有一种简化的数据交换格式,叫做yaml. 我翻了一遍它的文档,看懂的地方不多,但是有一句话令我茅塞顿开. 它说,从结构上看,所有的数据最终都可以分成三种类型: 第一种类型是scalar(标量),也就是一个单独的string(字符串)或数字(numbers),比如"北京"这个单独的词. 第二种类型是sequence(序列),也就是若干个相关的数据按照一定顺序并列在一起,又叫做array(数组)或List(列表),比如"北京,东京". 第三种类型是
-
使用JavaScript构建JSON格式字符串实现步骤
如果你现在正在使用Restful API,并且你需要通过web项目来构建json格式字符串的响应,那么这篇文章将帮助你使用javascript来创建json格式字符串.这是非常有用的,我们将通过jQuery插件$.toJSON把数据对象转换为json格式. 使用JavaScript构建JSON格式字符串 JavaScript代码: 在这里包含了javascript代码.$("#form").submit(function(){}- delete_button是form标签的ID,我们通
-
前后台交互过程中json格式如何解析以及如何生成
前台: 复制代码 代码如下: $.ajax({ type: "POST", url: "GetMenuRole.ashx", data: "", dataType: "json", success: function (data) { if (data.Status == false) { alert(data.ErrorReason); } else { //解析这个菜单列表 alert(data.MenuList); }
-
PHP JSON格式数据交互实例代码详解
在PHP中解析JSON主要用到json_encode和json_decode两个PHP JSON函数,比PHP解析XML方便很多,下面详细介绍下PHP JSON的使用.JSON基础介绍 JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式. JSON主要有两种结构: "名称/值"对的集合,在PHP中可以理解为关联数组 (associative array). 值的有序列表(An ordered list of values).在PHP中可以理解为
-
Jquery 组合form元素为json格式,asp.net反序列化
作者:敖士伟 Email:ikmb@163.com 转载注明作者 说明: 1.js根据表单元素class属性,把表单元素的name和value组合为json格式;用表单元素class属性可以针对性地组合JSON数据. 2.后端ASP.NET用JavaScriptSerializer反序列化为对象实列. 3.好处:简化了前端数据读取与后端数据赋值. 复制代码 代码如下: function GetJSONStr(class_name) { var a = []; //文本框 $("." +
-
asp.net转出json格式客户端显示时间
在服务器端利用 JavaScriptSerializer serializer = new JavaScriptSerializer(); return serializer.Serialize(obj); 对对像序列化, 对于时间类型得出结果为:\/Date(1216796600500)\/ 客户端解析的方式为: 复制代码 代码如下: function renderTime(data){ var da = eval('new ' + data.replace('/','','g').repla
-
JS 无限级 Select效果实现代码(json格式)
演示地址: http://demo.jb51.net/js/2011/js_select/index.htm数据 复制代码 代码如下: var data=[ {id:1,name:"前端开发",pid:0}, {id:2,name:"CSS",pid:1}, {id:3,name:"JS",pid:1}, {id:4,name:"HTML",pid:1}, {id:5,name:"数据库",pid:0},
-
JS将网址url转化为JSON格式的方法
网上方法很多,各种奇技淫巧,这里贴上一种较为正常的思路. 主要利用split对获取的字符串不断进行分割,最后获得所需要的格式. 代码如下 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>将url转化为json数据</title> </head> <script> function
-
JS中的数组转变成JSON格式字符串的方法
有一个JS数组,如: var arr = [["projectname1","projectnumber1"],["projectname2","projectnumber2"],["projectname3","projectnumber3"]]; 想将此数组转换成JSON字符串,如: var jsonarr = [{"projectname":projectnam
-
js 触发select onchange事件代码
select 或text的onchange事件需要手动(通过键盘输入)改变select或text的值才能触发,如果在js中给select或text赋值,则无法触发onchang事件, 例如,在页面加载完成以后,需要触发一个onChange事件,在js中用document.getElementById("province").value="湖北";直接给select或text赋值是不行的,要想实现手动触发onchange事件,需要在js给select赋值后,加入下面的
-
JS 进度条效果实现代码整理
第一种方法:Loading.js 复制代码 代码如下: //频率 var frequency = 50; //步长 var step = 3; //背景颜色 var loadingBgcolor = "#ffffff"; //宽度 var loadingWidth = 354; /* *参数说明: *content:显示内容,可以为空: *imageURL:将引用JS文件的路径设置即可: *left:进度条显示位置left *top:进度条显示位置top */ function Loa
-
js 分栏效果实现代码
网上我也见到一些分栏效果,也有一个jquery的插件jquery.splitter.js, 但是他们基本都没有解决一个问题:如果页面上有iframe, 当拖动分割线经过iframe的时候,鼠标不听使唤了,我曾经开过帖子讨论过这个问题.本例采用一个小技巧解决了这个问题,使拖动流畅. 复制代码 代码如下: <html> <head> <title>Splitter demo</title> <style> #splitter_
-
js时钟翻牌效果实现代码分享
先给大家上运行效果图,看看是不是特别棒! 这一张是小编抓拍时钟翻牌时的效果图: 为大家分享的JavaScript时钟翻牌效果代码如下 <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Create an Animated Flip Down Clock</title> <link rel=&quo
-
JS实现选项卡效果的代码实例
选项卡这个效果估计以后的项目会经常涉及到,对代码还是半熟练的情况下还是写下来吧. 先来布局一个简单的页面: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> *{margin: 0;padding: 0;list-style: none;} #box
-
js展开闭合效果演示代码
复制代码 代码如下: <!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> <meta http-equiv=&qu
-
最简单的js图片切换效果实现代码
无意中在网上发现的,代码非常的简单,一看就明白! 复制代码 代码如下: <script language =javascript > var curIndex=0; //时间间隔 单位毫秒 var timeInterval=5000; var arr=new Array(); arr[0]="1.jpg"; arr[1]="2.jpg"; arr[2]="3.jpg"; arr[3]="4.jpg"; arr[4]
随机推荐
- JSP隐含对象response实现文件下载的两种方法
- jQuery实现类似淘宝购物车全选状态示例
- CentOS7下Docker的安装教程
- java 1.8 动态代理源码深度分析
- Linq to XML 用一句话读出RSS文章列表代码
- 详解在ASP.NET Core中使用Angular2以及与Angular2的Token base身份认证
- javascript 不用reverse实现字符串反转的代码
- python简单判断序列是否为空的方法
- IE 5.x/Win 和模型bug
- win2003 jsp运行环境架设心得(jdk+tomcat)
- 学习php设计模式 php实现适配器模式
- jquery-tips悬浮提示插件分享
- JavaScript用select实现日期控件
- C++ boost 时间与日期处理详细介绍
- 微信小程序 教程之WXSS
- C#编程和Visual Studio使用技巧(上)
- 安卓(Android)开发之统计App启动时间
- Android编程实现滑动按钮功能详解
- Java+opencv3.2.0实现模板匹配
- LINUX Centos7搭建vsftpd服务