Javascript treeview JS中的限制-仅选中一个复选框

我对JS中的“treeview”有一个小问题 treeview工作正常，但现在我需要应用一些限制

treeview具有以下结构： 父节点>节点>子节点

限制是我不能在“父节点”内选择多个“节点”，而在其“节点”内，我也不能选择多个“子节点”。也就是说，我只能在每个父节点之间标记一个复选框

如果我在“子节点”内设置了另一个复选框，则必须取消选中已设置的复选框并标记新复选框（如单选按钮）

与“节点”相同，只能在每个“父节点”中标记一个节点

父1
家长2

节点2.1
节点2.2

子节点2.2.1
子节点2.2.2
子节点2.2.3


节点2.3


家长3

节点3.1
节点3.2

以下是JS：

    (function( $ ){
    var plugin = {
        name: 'TreeView',
        version: '1.0.0'
    }
    var defaults = {
        debug : false,
        autoExpand : false,
        css : {
            list : 'fa-ul',
            listItem : 'fa-li fa',
            collapsed : 'fa-caret-right',
            expanded : 'fa-caret-down'
        }
    }

    var settings;
    var debug, me = null;

    function __changeHandler( e ) {
        var currentTarget = $(this);
        var isChecked = currentTarget.is(':checked');

        debug.log(currentTarget);
        debug.log("Checked ", isChecked)

        if (!isChecked) {
            debug.log('Uncheck all childs');

            currentTarget.parent()
                         .find('input.tw-control')
                         .prop('checked', false);
        }

        if (isChecked) {
            debug.log('Check my parents tree');

            currentTarget.parents('li')
                         .find('>input.tw-control')
                         .prop('checked', true);
        }

        _toggleCollapse( currentTarget );

        me.trigger('treeview.change', currentTarget, me);
    }

    function _toggleCollapse ( element ) {
        debug.log("Toggle collapse");

        var chk = $('input[type="checkbox"]:checked');

        if (chk.is(':checked')) {
            debug.log('Open checked branchs');
            chk.parent()
               .find('>ul.collapse')
               .collapse('show')
               .parent()
               .find('>i.fa-li')
               .removeClass(settings.css.collapsed)
               .addClass(settings.css.expanded);
        }

        if (!element.is(':checked')) {
            debug.log('Hide branch');

            element.parent()
                   .find('ul.collapse')
                   .collapse('hide')
                   .parent()
                   .find('i.fa-li')
                   .removeClass(settings.css.expanded)
                   .addClass(settings.css.collapsed);
        }
    }

    function _init() {
        debug.log( "Initializing plugin" );

        me.on('change', 'input.tw-control', __changeHandler);

        debug.log("Collapsing tree");


        me.find('>ul')
          .addClass(settings.css.list)
          .find('ul')
          .addClass('collapse ' +  settings.css.list)
          .parent()
          .prepend(
              $('<i></i>').addClass(settings.css.listItem + ' ' +
                                    settings.css.collapsed)
          );

        if (settings.autoExpand) {
            me.find('ul.collapse').collapse('show');
        }

        debug.log("Adding checkbox");

        me.find('li').each(function( index, element ) {
            var elmt = $(element);

            var chk = $('<input/>').prop('type', 'checkbox')
                                   .prop('class', 'tw-control')
                                   .prop('value', elmt.attr('data-value'));

            debug.log("Checking if the element is selected");

            var isChecked = elmt.attr('data-checked');

            elmt.prepend(chk);

            if ( isChecked ) {
                debug.log('Toggle checkbox');

                chk.prop('checked', true);

                chk.trigger('change');
            }
        });
    }

    function _fill( data ) {
        $( data ).each(function (index, element) {
            me.find('input[value="' + element + '"]')
              .prop('checked', true)
              .trigger('change');
        });
    }

    var publicMethods = {
        init : function( options ) {
            me = this;

            settings = $.extend( defaults, options );

            debug = $.Logger(settings.debug, plugin);

            _init();

            debug.log('Ready');

            _fill ( options.data );

            return this;
        },
        selectedValues: function() {
            debug.log("Getting selected values");

            var chk = me.find('input[type="checkbox"]:checked');
            var output = [];

            chk.each(function(index, item) {
                var item = $(item);

                if(typeof item.parent().attr('data-value') !== typeof undefined) {
                    output.push(item.attr('value'));
                }
            })

            return output;
        }
    }

    $.fn.treeview = function (options) {
        if ( publicMethods[options] ) {
            return publicMethods[ options ].apply( this, Array.prototype.slice.call( arguments, 1 ));
        } else if ( typeof options === 'object' || ! options ) {
            // Default to "init"
            return publicMethods.init.apply( this, arguments );
        } else {
            $.error( 'Method ' +  options  + ' does not exist on jQuery.treeview' );
        }
    }

}( jQuery ));

$('#treeview-container').treeview({
            debug : true,
            data : ['3.2', '2.2.3']
        });

（函数（$）{
变量插件={
名称：“TreeView”，
版本：“1.0.0”
}
var默认值={
调试：错误，
自动展开：false，
css:{
列表：“faul”，
列表项：'fa li fa'，
崩溃：“右前插入符号”，
扩展：“fa插入符号向下”
}
}
var设置；
var debug，me=null；
函数uu changeHandler（e）{
var currentTarget=$（此值）；
var isChecked=currentTarget.is（“：checked”）；
log（currentTarget）；
debug.log（“已检查”，已检查）
如果（！已检查）{
log（'Uncheck all child'）；
currentTarget.parent（）
.find（'input.tw control'）
.prop（'checked'，false）；
}
如果（已检查）{
log（'检查我的父树'）；
currentTarget.parents（'li'）
.find（'>input.tw-control'）
.prop（'checked'，true）；
}
_切换崩溃（currentTarget）；
触发器（'treeview.change'，currentTarget，me）；
}
函数_toggleCollapse（元素）{
log（“切换折叠”）；
var chk=$（'input[type=“checkbox”]：checked'）；
如果（chk.is（'：checked'））{
log（'打开检查的分支'）；
chk.parent（）
.find（“>ul.collapse”）
.collapse（'显示'）
.parent（）
.find（'>i.fa-li'）
.removeClass（settings.css.collapsed）
.addClass（settings.css.expanded）；
}
如果（！element.is（':checked'））{
log（'Hide branch'）；
元素。父元素（）
.find（'ul.collapse'）
.collapse（'隐藏'）
.parent（）
.find（'i.fa-li'）
.removeClass（settings.css.expanded）
.addClass（settings.css.collapsed）；
}
}
函数_init（）{
log（“初始化插件”）；
me.on（'change'、'input.tw control'、\uu changeHandler）；
log（“折叠树”）；
me.find（'>ul'）
.addClass（settings.css.list）
.find（'ul'）
.addClass（'collapse'+settings.css.list）
.parent（）
.预编(
$（''）.addClass（settings.css.listItem+''）+
settings.css.collapsed）
);
如果（设置。自动展开）{
我发现（'ul.collapse'）。collapse（'show'）；
}
log（“添加复选框”）；
me.find（'li'）。每个（函数（索引，元素）{
var elmt=$（元素）；
var chk=$（''）.prop（'type'，'checkbox'）
.prop（'class'，'tw control'）
.prop（'value'，elmt.attr（'data-value'））；
log（“检查元素是否被选中”）；
var isChecked=elmt.attr（'data-checked'）；
elmt.prepend（chk）；
如果（已检查）{
log（'Toggle checkbox'）；
chk.道具（“已检查”，正确）；
变更触发（“变更”）；
}
});
}
函数_填充（数据）{
$（数据）。每个（函数（索引、元素）{
me.find（'input[value=“”+element+”]”输入）
.prop（'checked'，true）
.触发（“变更”）；
});
}
var publicMethods={
初始化：函数（选项）{
我=这个；
设置=$.extend（默认值、选项）；
调试=$.Logger（settings.debug，plugin）；
_init（）；
log（'Ready'）；
_填充（选项.数据）；
归还这个；
},
selectedValues:function（）{
log（“获取所选值”）；
var chk=me.find（'input[type=“checkbox”]：checked'）；
var输出=[]；
chk.每个（功能（索引，项目）{
var项目=$（项目）；
if（typeof item.parent（）.attr（'data-value'）！==typeof undefined）{
output.push（item.attr（'value'））；
}
})
返回输出；
}
}
$.fn.treeview=函数（选项）{
如果（publicMethods[选项]）{
return publicMethods[options].apply（this，Array.prototype.slice.call（arguments，1））；
}else if（typeof options==='object'| |！options）{
    (function( $ ){
    var plugin = {
        name: 'TreeView',
        version: '1.0.0'
    }
    var defaults = {
        debug : false,
        autoExpand : false,
        css : {
            list : 'fa-ul',
            listItem : 'fa-li fa',
            collapsed : 'fa-caret-right',
            expanded : 'fa-caret-down'
        }
    }

    var settings;
    var debug, me = null;

    function __changeHandler( e ) {
        var currentTarget = $(this);
        var isChecked = currentTarget.is(':checked');

        debug.log(currentTarget);
        debug.log("Checked ", isChecked)

        if (!isChecked) {
            debug.log('Uncheck all childs');

            currentTarget.parent()
                         .find('input.tw-control')
                         .prop('checked', false);
        }

        if (isChecked) {
            debug.log('Check my parents tree');

            currentTarget.parents('li')
                         .find('>input.tw-control')
                         .prop('checked', true);
        }

        _toggleCollapse( currentTarget );

        me.trigger('treeview.change', currentTarget, me);
    }

    function _toggleCollapse ( element ) {
        debug.log("Toggle collapse");

        var chk = $('input[type="checkbox"]:checked');

        if (chk.is(':checked')) {
            debug.log('Open checked branchs');
            chk.parent()
               .find('>ul.collapse')
               .collapse('show')
               .parent()
               .find('>i.fa-li')
               .removeClass(settings.css.collapsed)
               .addClass(settings.css.expanded);
        }

        if (!element.is(':checked')) {
            debug.log('Hide branch');

            element.parent()
                   .find('ul.collapse')
                   .collapse('hide')
                   .parent()
                   .find('i.fa-li')
                   .removeClass(settings.css.expanded)
                   .addClass(settings.css.collapsed);
        }
    }

    function _init() {
        debug.log( "Initializing plugin" );

        me.on('change', 'input.tw-control', __changeHandler);

        debug.log("Collapsing tree");


        me.find('>ul')
          .addClass(settings.css.list)
          .find('ul')
          .addClass('collapse ' +  settings.css.list)
          .parent()
          .prepend(
              $('<i></i>').addClass(settings.css.listItem + ' ' +
                                    settings.css.collapsed)
          );

        if (settings.autoExpand) {
            me.find('ul.collapse').collapse('show');
        }

        debug.log("Adding checkbox");

        me.find('li').each(function( index, element ) {
            var elmt = $(element);

            var chk = $('<input/>').prop('type', 'checkbox')
                                   .prop('class', 'tw-control')
                                   .prop('value', elmt.attr('data-value'));

            debug.log("Checking if the element is selected");

            var isChecked = elmt.attr('data-checked');

            elmt.prepend(chk);

            if ( isChecked ) {
                debug.log('Toggle checkbox');

                chk.prop('checked', true);

                chk.trigger('change');
            }
        });
    }

    function _fill( data ) {
        $( data ).each(function (index, element) {
            me.find('input[value="' + element + '"]')
              .prop('checked', true)
              .trigger('change');
        });
    }

    var publicMethods = {
        init : function( options ) {
            me = this;

            settings = $.extend( defaults, options );

            debug = $.Logger(settings.debug, plugin);

            _init();

            debug.log('Ready');

            _fill ( options.data );

            return this;
        },
        selectedValues: function() {
            debug.log("Getting selected values");

            var chk = me.find('input[type="checkbox"]:checked');
            var output = [];

            chk.each(function(index, item) {
                var item = $(item);

                if(typeof item.parent().attr('data-value') !== typeof undefined) {
                    output.push(item.attr('value'));
                }
            })

            return output;
        }
    }

    $.fn.treeview = function (options) {
        if ( publicMethods[options] ) {
            return publicMethods[ options ].apply( this, Array.prototype.slice.call( arguments, 1 ));
        } else if ( typeof options === 'object' || ! options ) {
            // Default to "init"
            return publicMethods.init.apply( this, arguments );
        } else {
            $.error( 'Method ' +  options  + ' does not exist on jQuery.treeview' );
        }
    }

}( jQuery ));

$('#treeview-container').treeview({
            debug : true,
            data : ['3.2', '2.2.3']
        });