easyui中combotree只能选子选项，父级不被选中
前言
前幾天面試遇到一個需求（easyui中combotree只能選子選項(xiàng)，父級不被選中），回來特意整理下，大概的思想是如果該tree的節(jié)點(diǎn)被選中是判定一下是否有子節(jié)點(diǎn)，如果沒有就說明是最終節(jié)點(diǎn)了，步驟如下：
1. 原來計劃是看json數(shù)據(jù)的話有個children字段標(biāo)識，后來用google的開發(fā)工具發(fā)現(xiàn)沒有，但是哥們發(fā)現(xiàn)了一個state字段，即父級的話會自動給一個state字段，為closed或者open值，但是最終子節(jié)點(diǎn)沒有這個字段，如下圖：
a. 選個子節(jié)點(diǎn)瞅瞅：
b. 選個父節(jié)點(diǎn)瞅瞅：
2. 找到合適的事件監(jiān)聽，哥們在easyui的tree的api找到了這個：
onBeforeSelect：參數(shù)是node，解釋：節(jié)點(diǎn)被選中之前觸發(fā),返回false取消選擇動作（取消動作，哥們看到這就亮了，莫名的雞凍）。
來靈感了吧，淡定淡定，開整。
代碼如下（代碼是easyui 1.3.2的demo里的文件路徑都一樣，不同的是哥們我把json數(shù)據(jù)寫到j(luò)s里了，懶得發(fā)布測試，這樣直接可以看效果呢）：
<!DOCTYPE html> <html> <head><meta charset="UTF-8"><title>ComboTree</title><link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css"><link rel="stylesheet" type="text/css" href="../../themes/icon.css"><script type="text/javascript" src="../../jquery-1.8.0.min.js"></script><script type="text/javascript" src="../../jquery.easyui.min.js"></script><script type="text/javascript" >$(function(){$('#cc').combotree({onBeforeSelect:function(node){alert(node.state);if(node.state){$("#cc").tree("unselect");}},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"}]}]});});</script> </head> <body><input id="cc" style="width:200px;"> </body> </html>有機(jī)會的話的和他探討一番，收工...........（記2014年3月26日面試）
總結(jié)
以上是生活随笔為你收集整理的easyui中combotree只能选子选项，父级不被选中的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 自定加载的简单实例
- 下一篇： 20个linux命令行工具监视性能(上)