帶複選框的Treeview簡單的HTML與Css

Question

我正在爲我的ipfire備份系統尋找樹形格式。 用戶需要選擇要更新的文件夾。像圖像 - >

爲例

服務器腳本是CGI Perl的，但我可以實現簡單的HTML和CSS或者非常簡單的JS。 我需要的父文件夾，如果檢查全自動檢查內容

Answer 1

我不知道你的HTML，但它是否適合這個

<div class="tree"> 
    <input type="checkbox" /> 1. 
    <div> 
    <input type="checkbox" /> 1.1. 
    <div> 
     <input type="checkbox" /> 1.1.1. 
    </div> 
    </div> 
</div> 

，如果你使用jQuery庫，你可以那樣做

$(document).ready(function() { 
    $('.tree input[type="checkbox"]').on('change', function() { 
    checkParent($(this)); 
    }); 

    function checkParent(element) { 
    if (element.prop('checked')) { 
     var parent = element.parent().parent().find('> input[type="checkbox"]'); 

     if (parent.length) { 
     parent.prop('checked', true); 
     checkParent(parent); 
     } 
    } 
    } 
});