快捷導(dǎo)航

解決Jstree 選中父節(jié)點(diǎn)時(shí)被禁用的子節(jié)點(diǎn)也會(huì)選中的問(wèn)題

更新時(shí)間：2017年12月27日 08:39:39 作者：DonaldTDZ

下面小編就為大家分享一篇解決Jstree 選中父節(jié)點(diǎn)時(shí)被禁用的子節(jié)點(diǎn)也會(huì)選中的問(wèn)題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧

問(wèn)題描述：

最近用jstree遇到一個(gè)問(wèn)題，父節(jié)點(diǎn)選中時(shí)，被禁用的子節(jié)點(diǎn)也會(huì)選中如下

解決方案：

1、將jstree升級(jí)到最新的版本，v3.3.4及以上就可以

2、修改checkbox插件配置，將cascade_to_disabled設(shè)置為false（注：需要將配置腳本放jstree.min.js的后面）

<script src="./../../dist/jstree.min.js"></script>
<script>
$.jstree.defaults.checkbox = {
      visible: true,
      three_state: true,
      whole_node: true,
      keep_selected_style: true,
      cascade: '',
      tie_selection: true,
      /**
      * This setting controls if cascading down affects disabled checkboxes
      * @name $.jstree.defaults.checkbox.cascade_to_disabled
      * @plugin checkbox
      */
      cascade_to_disabled : false,
      cascade_to_hidden : true
};
 
 
$('#data').jstree({
    'core' : {
      'data' : [
        { "text" : "Root node", "children" : [
            { "text" : "Child node 1", "state": { "disabled": true } },
            { "text" : "Child node 2" },
            { "text" : "Child node 3" },
            { "text" : "Child node 4" },
            { "text" : "Child node 5" },
            { "text" : "Child node 6" }
        ]}
      ]
    }
    ,"plugins" : [ "checkbox" ]
  });
</script>

修改后當(dāng)選中父節(jié)點(diǎn)時(shí)，子節(jié)點(diǎn)會(huì)跳過(guò)禁用子節(jié)點(diǎn)如下：

以上這篇解決Jstree 選中父節(jié)點(diǎn)時(shí)被禁用的子節(jié)點(diǎn)也會(huì)選中的問(wèn)題就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。

相關(guān)文章

如何實(shí)現(xiàn)textarea里的不同文本顯示不同顏色
如何實(shí)現(xiàn)textarea里的不同文本顯示不同顏色呢？控制textarea的style設(shè)置Textarea以及把文本放到標(biāo)記里都不會(huì)起作用，下面有個(gè)不錯(cuò)的解決方法，感興趣的朋友可以了解下
2014-01-01
layui左側(cè)菜單欄鼠標(biāo)懸停顯示菜單文字功能實(shí)現(xiàn)
layui封裝的左側(cè)菜單是固定寬度的,且左側(cè)菜單欄在css里改變寬度,效果并不是很好（還設(shè)計(jì)頭部菜單欄）,如果寫(xiě)js來(lái)讓菜單欄能夠拉伸,也比較麻煩,那怎么最簡(jiǎn)單的,讓用戶(hù)看到菜單的文字呢,下面給大家分享layui左側(cè)菜單欄鼠標(biāo)懸停顯示菜單文字功能實(shí)現(xiàn),感興趣的朋友一起看看吧
2024-06-06
理解javascript async的用法
本篇文章主要介紹了理解javascript async的用法，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2017-08-08
仿iPhone通訊錄制作小程序自定義選擇組件的實(shí)現(xiàn)
這篇文章主要介紹了仿iPhone通訊錄制作小程序自定義選擇組件的實(shí)現(xiàn)，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧
2019-05-05
使用console進(jìn)行性能測(cè)試
各大瀏覽器內(nèi)置的開(kāi)發(fā)工具，都提供了一個(gè)console對(duì)象。它主要有兩個(gè)作用：顯示網(wǎng)頁(yè)代碼運(yùn)行時(shí)的錯(cuò)誤信息。提供了一個(gè)命令行接口，用來(lái)與網(wǎng)頁(yè)代碼互動(dòng)。下面我們就來(lái)詳細(xì)研究下如何使用console進(jìn)行性能測(cè)試。
2015-04-04
JavaScript中innerHTML使用方法實(shí)例
js中常常用到innerHTML,其作用就是獲取到標(biāo)簽里面的內(nèi)容,同時(shí)也可以為標(biāo)簽添加內(nèi)容,下面這篇文章主要給大家介紹了關(guān)于JavaScript中innerHTML使用方法的相關(guān)資料,需要的朋友可以參考下
2022-10-10
js實(shí)現(xiàn)多選項(xiàng)切換導(dǎo)航菜單的方法
這篇文章主要介紹了js實(shí)現(xiàn)多選項(xiàng)切換導(dǎo)航菜單的方法,可實(shí)現(xiàn)動(dòng)態(tài)生成多選項(xiàng)切換導(dǎo)航菜單的功能,是非常實(shí)用的技巧,需要的朋友可以參考下
2015-02-02
基于JS實(shí)現(xiàn)接粽子小游戲的示例代碼
端午節(jié)馬上就到了，聽(tīng)說(shuō)你們公司沒(méi)發(fā)粽子大禮包？沒(méi)關(guān)系，這里用?JS實(shí)現(xiàn)了一個(gè)簡(jiǎn)單的接粽子小游戲，能接到多少粽子，完全看你手速，快跟隨小編一起來(lái)學(xué)習(xí)學(xué)習(xí)吧
2022-05-05
JavaScript比較兩個(gè)對(duì)象是否相等的方法
這篇文章主要介紹了JavaScript比較兩個(gè)對(duì)象是否相等的方法,通過(guò)對(duì)js對(duì)象進(jìn)行各方面的比較來(lái)判斷兩個(gè)對(duì)象是否相等,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
2015-02-02
javascript中RegExp保留小數(shù)點(diǎn)后幾位數(shù)的方法分享
文章介紹一篇關(guān)于javascript中RegExp保留小數(shù)點(diǎn)后幾位數(shù)方法，有需要了解的朋友可以參考一下
2013-08-08