栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 软件开发 > Web开发 > JavaScript

easyui tree带checkbox实现单选的简单实例

JavaScript 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

easyui tree带checkbox实现单选的简单实例

实例如下:

    $('#regionTree').tree({
          cascadeCheck: false,
          //onlyLeafCheck: true,
          checkbox: true,
          data: [{
     "id": 1,
     "text": "My documents",
     "children": [{
       "id": 11,
       "text": "Photos",
       "state": "closed",
       "children": [{
         "id": 111,
         "text": "Friend"
       }, {
         "id": 112,
         "text": "Wife"
       }, {
         "id": 113,
         "text": "Company"
       }]
     }, {
       "id": 12,
       "text": "Program Files",
       "children": [{
         "id": 121,
         "text": "Intel"
       }, {
         "id": 122,
         "text": "Java",
         "attributes": {
    "p1": "Custom Attribute1",
    "p2": "Custom Attribute2"
         }
       }, {
         "id": 123,
         "text": "Microsoft Office"
       }, {
         "id": 124,
         "text": "Games",
         "checked": true
       }]
     }, {
       "id": 13,
       "text": "index.html"
     }, {
       "id": 14,
       "text": "about.html"
     }, {
       "id": 15,
       "text": "welcome.html"
     }]
          }]
          ,
          width: 160,
          height: 32,
          panelHeight: 400,
          onSelect: function (node) {
     var cknodes = $('#regionTree').tree("getChecked");
     for (var i = 0; i < cknodes.length; i++) {
       if (cknodes[i].id != node.id) {
         $('#regionTree').tree("uncheck", cknodes[i].target);
       }
     }
     if (node.checked) {
       $('#regionTree').tree('uncheck', node.target);
    
     } else {
       $('#regionTree').tree('check', node.target);
    
     }
    
          },
          onLoadSuccess: function (node, data) {
     $(this).find('span.tree-checkbox').unbind().click(function () {
       $('#regionTree').tree('select', $(this).parent());
       return false;
     });
          }
        })

    关键代码:

    onSelect: function (node) {
     var cknodes = $('#regionTree').tree("getChecked");
     for (var i = 0; i < cknodes.length; i++) {
       if (cknodes[i].id != node.id) {
         $('#regionTree').tree("uncheck", cknodes[i].target);
       }
     }
     if (node.checked) {
       $('#regionTree').tree('uncheck', node.target);
    
     } else {
       $('#regionTree').tree('check', node.target);
    
     }
    
          },
          onLoadSuccess: function (node, data) {
     $(this).find('span.tree-checkbox').unbind().click(function () {
       $('#regionTree').tree('select', $(this).parent());
       return false;
     });
          }

    以上这篇easyui tree带checkbox实现单选的简单实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持考高分网。

    转载请注明:文章转载自 www.mshxw.com
    本文地址:https://www.mshxw.com/it/92952.html
    我们一直用心在做
    关于我们 文章归档 网站地图 联系我们

    版权所有 (c)2021-2022 MSHXW.COM

    ICP备案号:晋ICP备2021003244-6号