示例
1、定義標簽

 <input id="test"  value="xxxx" /> <!-- value 為默認值 -->

2、初始化組件

var $ = layui.$;

$(function(){
	layui.config({
		  base: '${pageContext.request.contextPath}/js/layuiExtend' //配置 layui 第三方擴展組件存放的基礎目錄
		}).extend({
			asynTreeSelect: '/asynTreeSelect'
		}).use(['asynTreeSelect'], function(){
		
		 
	  var asynTreeSelect = layui.asynTreeSelect;
	  
	  asynTreeSelect.render({
	    elem: '#test'
	    ,getCurrentNodeUrl:"${pageContext.request.contextPath}/test/getRealmByParam1.action" //根據paramName獲取當前節點(diǎn)的請求
	    ,getChildrenNodeUrl:"${pageContext.request.contextPath}/test/getRealmByParam1.action" //根據paramName獲取子節點(diǎn)的請求
	    ,getBrotherNodeUrl:"${pageContext.request.contextPath}/test/getRealmByParam1.action" //根據paramName獲取兄弟節點(diǎn)的請求
	    ,paramName:"currNodeId" //請求后臺帶的參數，此處為區域id
	    ,paramType:"postType" //請求后臺自帶的參數，獲取本節點(diǎn)時(shí)候 postType=1，獲取子節點(diǎn)時(shí)候 postType=2,獲取兄弟節點(diǎn)的時(shí)候該值為3
	                          //所以后臺可以根據此值判斷是發(fā)出什么請求，getCurrentNodeUrl、getChildrenNodeUrl、getBrotherNodeUrl請求都是同一個(gè)就行
	    ,rootNodeValue:"44"
	    //,defaultValue:"440232"
	    ,separator:"/"
	    ,showRootNode:true //是否顯示根節點(diǎn)，默認true
	    //,maxWidth:400
	    ,response:{
       	     idName:"REALM_ID"
            ,valueName:"REALM_NAME"
            ,parentName:"PARENT_ID"
        }
	   /*    ,onlick:function(data){
	    	console.log(data)
	    }   */
	  });
	  
	  //三個(gè)請求返回數據的格式為 [{REALM_ID:"4401",REALM_NAME:"廣州",PARENT_ID:"44"},{REALM_ID:"4402",REALM_NAME:"深圳",PARENT_ID:"44"}]
	});
	var form = layui.form;  
	 form.render();

3、截圖


源碼附j(luò )ava例子。請移步碼云下載