1 $(function() {2 $('.treedropdown').each(function() {3 var id = $(this).attr('id') + "_tree";4 var loca = $(this).offset();5 $(this).after('');6
7 $('#' +id)8 .offset({ top: loca.top, left: loca.left })9 .hover(function() {10 $(this).show();11 }, function() {12 $(this).fadeOut();13 });14
15 $(this).click(function() {16 $.target = $(this);17 $('#' + $(this).attr('id') + '_tree').fadeIn('100');18 });19 });20 GetDataSource('');21 });
脚本初始化
在初始化中我们为页面中 class 标记了 “treedropdown” 的元素创建一个 “tree” 的容器,及指定数据将在这里绑定树型结构,并指定位置。笔者将定义文本框的单击事件来触发显示 “Tree”。
1 functionGetDataSource(id) {2 isAll = false;3 $.post('datasource.json', function(json) {4 var tree =eval(json);5 if ($('.tree').html() == "") {6 for (var i intree) {7 var node =tree[i];8 $('.tree').append('
-
' + node.name + '