JS無限極樹形選單,json格式、陣列格式通用範例_javascript技巧

修改了一下資料格式，是json和陣列或混合型的資料都通用，不用特定key等

複製程式碼 程式碼如下:

  

";
}
return str;
}
/*新增無層級樹*/
document.getElementById("menuTree").innerHTML = forTree(json);
/*樹形選單*/
var menuTree = function () {
//給有子物件的元素加[ -]
$("#menuTree ul").each(function (index, element) {
var ulContent = $ (element).html();
var spanContent = $(element).siblings("span").html();
if (ulContent) {
$(element).siblings("span ").html("[ ] " spanContent)
}
});


$("#menuTree").find("div span").click(function ( ) {
var ul = $(this).siblings("ul");
var spanStr = $(this).html();
var spanContent = spanStr.substr(3, spanStr.length );
if (ul.find("div").html() != null) {
if (ul.css("display") == "none") {
ul.show (300);
$(this).html("[-] " spanContent);
} else {
ul.hide(300);
$(this).html("[ ] " spanContent);
}
}
})
} ()

/*展開*/
$("#btn_open").click(function ( ) {
$("#menuTree ul").show(300);
curzt("-");
})
/*縮*/
$("#btn_close ").click(function () {
$("#menuTree ul").hide(300);
curzt(" ");
})
function curzt(v) {
$("#menuTree span").each(function (index, element) { var ul = $(this).siblings("ul"); var spanStr = $(this).html (); var spanContent = spanStr.substr(3, spanStr.length); if (ul.find("div").html() != null) { $(this). html("[" v "] " spanContent); } }); }