[置顶] easyUI入门--3

• Tree

• tree加载过程

  $(function() {
  
  // 通过js渲染tree组件
  $("#nav").tree({
      url : '${pageContext.request.contextPath}/getTree.action',
      lines : true,
      onLoadSuccess : function(node, data) {
          if (data) {
              // 遍历获取的节点
              $(data).each(function() {
                  // 判断对象的state是否为closed
                  if (this.state == 'closed') {
                      // 整个tree展开
                      $("#nav").tree('expandAll');
                  }
              });
          }
      }
  });
  

• 监听打开事件，当打开按钮时

  $('#nav')
          .tree(
                  {
                      onClick : function(node) {
  
                          // 判断触发条件，node的url参数不为空
                          if (node.url) {
                              alert(node.url);
                              if ($("#tabs").tabs('exists', node.text)) { // 判断tab是否存在
  
                                  // 选中tab
                                  $("#tabs").tabs('select', node.text);
  
                              } else { // 若不存在，添加tab
                                  $("#tabs")
                                          .tabs(
                                                  'add',
                                                  {
                                                      title : node.text,
                                                      href : '${pageContext.request.contextPath}/2_datagrid/datagird.jsp',
                                                      iconCls : node.iconCls,
                                                      closable : true,
                                                  });
                              }
                          }
                      }
                  });
  

• 设置iframe标签

  function createStr(url) {
          var str = '<iframe style="width:100%;height:100%;" frameborder="no" src="'
                  + url + '"></iframe>';
          //alert(str);
          return str;
      }