jquery easyui js加载执行两次

今天刚碰到的问题，莫名其妙 树被载入的时候 执行了两次！

 1 <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>

 2 <script>

 3 $(function(){

 4         $('#left_menu_tree').tree({

 5             url:'jslib/tree_data2.json',

 6             animate:true,//定义当展开/折叠节点的时候是否显示效果.

 7             lines:true,//定义是否显示树线.

 8             onClick:function(node){

 9                 //node.state获取节点状态, 'open' 或者 'closed' 如果typeof 是undefined 说明该节点是叶节点

10                 if( typeof node.state != 'undefined'){

11                     $(this).tree('toggle', node.target);//切换expanded/collapsed 节点的状态,target 参数指明节点DOM对象.

12                 }else{

13                     CreateTab(node.text,node.attributes.url,node.iconCls);//自定义函数：创建TAB页

14                 }

15              }

16         });

17 });

18 </script>

19 <ul id="left_menu_tree" class="easyui-tree" data-options="animate:true,fit:true"></ul>

最后找到原因：

EasyUI组件加了class="easyui-tree" 然后又通过脚本为其注册属性.这样造成了两次渲染加载

EasyUI解析html代码的时候先解析class声明中的easyui-tree组件请求了一次url然后又调用了js中初始化的代码初始化一次数据，导致重复加载

修改后代码：

 1 <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>

 2 <script>

 3 $(function(){

 4         $('#left_menu_tree').tree({

 5             url:'jslib/tree_data2.json',

 6             animate:true,//定义当展开/折叠节点的时候是否显示效果.

 7             lines:true,//定义是否显示树线.

 8             onClick:function(node){

 9                 //node.state获取节点状态, 'open' 或者 'closed' 如果typeof 是undefined 说明该节点是叶节点

10                 if( typeof node.state != 'undefined'){

11                     $(this).tree('toggle', node.target);//切换expanded/collapsed 节点的状态,target 参数指明节点DOM对象.

12                 }else{

13                     CreateTab(node.text,node.attributes.url,node.iconCls);//自定义函数：创建TAB页

14                 }

15              }

16         });

17 });

18 </script>

19 <ul id="left_menu_tree"  data-options="animate:true,fit:true"></ul>