前段时间一直没有想到这种方法，所以一直在用easyUI插件，不过我觉得吧还是自己写比较满意；话不多说直接上码

@model IEnumerable<tree.Models.ajaxtree>

@{

ViewBag.Title = "detail";

}

<h2>detail</h2>

<script type="text/javascript">

var flat=true;

function csschange(cid){

var dd=$("#"+cid+"-div").css("display");

//alert(dd);

if(dd=="block"){

// alert(111);

$("#"+cid+"-div").hide(1000);

// flat=false;

}

else{

$("#"+cid+"-div").show(1000);

// flat=true;

}

}

var html = "";

function changes(cid) {

$.ajax({

url: "/tree/treeList",

dataType: "json",

data: { "cid": cid },

type: "post",

success: function (list) {

for (s in list) {

html = "<li><a href='#'>" + list[s].name + "</a></li>";

$("#" + cid + "-div").append(html);

}

$("#"+cid+"-a").removeAttr("onclick");

$("#"+cid+"-a").attr("onclick","csschange("+cid+")");

$("#"+cid+"-a").css("display","block");

}

});

}

</script>

<style type="text/css">

.cc {

width: 90px;

height: auto;

background-color: #FEFEFE;

}

</style>

<div class="container">

<div class="nav" style="width:120px;">

@foreach (var c in Model)

{

<a id="@c.cid-a" href="javascript:void();" οnclick="changes(@c.cid)" class="btn btn-default text-warning cc">@c.name</a>

<div id="@c.cid-div">

</div>

}

</div>

</div>