ajax点击左侧二级导航条,右侧显示内容

需要引入:
<link rel="stylesheet" href="bootstrap.css">
<script src="jquery-1.11.3.js"></script>
/*main.css*/
.main-container {
  position: relative;
}
.left_list {
  border: 1px solid #3b3b1f;
  position: fixed;
  top: 60px;
  overflow: auto;
  z-index: 1;
  width: 220px !important;
  height: 94% !important;
}
.l_top_nav {
  background: #0a9dc7;
  height: 42px;
  line-height: 46px;
  padding-left: 20px;
  color: #fff;
  font-size: 16px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.15);
}
/*左侧导航区*/
.main-container {
  position: relative;
}

.left_list {
  border: 1px solid #3b3b1f;
  position: fixed;
  top: 60px;
  overflow: auto;
  z-index: 1;
  width: 220px !important;
  height: 94% !important;
}

.l_top_nav {
  background: #0a9dc7;
  height: 42px;
  line-height: 46px;
  padding-left: 20px;
  color: #fff;
  font-size: 16px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.15);
}

/*ul一级导航*/
.nav_list {
  width: 220px;
  background: #0aaedb;
  cursor: pointer;
}

ul.nav_list > li > a {
  display: block;
  padding: 0 16px 0 10px;
  hieght: 40px;
  line-height: 40px;
}

ul.nav_list > li > a > span {
  display: inline-block;
  width: 30px;
  position: relative;
  top: 1px;
}

ul.nav_list > li > a > span.glyphicon-chevron-down {
  position: absolute;
  left: 166px;
  top: 14px;
  width: 30px;
}

.nav_list > li > ul.menu {
  /*padding: 5px 0;*/
  border-top: 1px solid rgba(0, 0, 0, 0.15);
  background: rgba(10, 158, 203, 0.42);
  font-size: 13px;
}

/*li二级导航*/
.nav_list > li > ul.menu > li {
  position: relative;
  top: 0;
}

.active {
  background: #0a79a0;
}

.nav_list > li > ul.menu > li > a {
  padding: 12px 0 9px 37px;
  display: block;
  position: relative;
  top: 0px;
  height: 40px;

}
.nav_list > li > ul.menu > li > a > i {
  font-size: 10px;
  position: absolute;
  left: 15px;
  top: 12px;
}

.icon-double-angle-right:before {
  content: ">";
}
.page-content {
  padding: 48px 6px 36px 212px;
}
/*右侧显示内容区*/.page_top{  position: relative;  top:61px;  left:220px;  padding: 8px 20px;}

<!--main.html-->    

<div class="main-container" id="main-container">
  <div class="left_list" id="left_list">
    <div class="l_top_nav">
      <span>导航菜单</span>
    </div>
    <ul class="nav_list nav " id="leftList">
      <li>
        <a href="#">
          <span class="glyphicon glyphicon-user"></span>
          用户管理
          <span class="glyphicon glyphicon-chevron-down"></span>
        </a>
        <ul class="menu list-unstyled dplay">
          <li class="active">
            <a href="javascript:a()"><i class="icon-double-angle-right"></i>用户管理</a>

	  </li>
          <li>

	    <a href="javascript:a()"><i class="icon-double-angle-right"></i>角色管理</a>

	  </li>
          <li>

	    <a href="javascript:a()"><i class="icon-double-angle-right"></i>菜单管理</a>

	  </li>
        </ul>
      </li>
      <li>
        <a>
          <span class="glyphicon glyphicon-comment"></span>
          客户信息
          <span class="glyphicon glyphicon-chevron-down"></span>
        </a>
        <ul class="menu list-unstyled hide">
          <li>

	    <a href="javascript:a()"><i class="icon-double-angle-right"></i>客户消息</a>
          </li>
          <li>

	    <a href="javascript:a()"><i class="icon-double-angle-right"></i>我的消息</a></li>
          <li>
            <a href="javascript:a()"><i class="icon-double-angle-right"></i>广告代理关系</a></li>
        </ul>
      </li>
    </ul>
  </div>

  <!--右侧显示内容区-->
  <div class="page-content"></div>

</div>

//main.js

//ajax

function a() {
  $.ajax({
    url: "url.html",  //要请求的页面
    global: false,    
    type: "get",    
    dataType: "html",  //请求类型
    async: false,   //是否为异步请求
    success: function (msg) {  //msg得到的数据(这里得到的是整个html代码)
      // alert(msg);
      $('.page-content').html(msg);
    }
  })
};

//左侧导航

$('.nav>li>a').bind('click', function () {
  if ($(this).next('ul').hasClass('dplay')) {
    $(this).parent('li').removeClass('hideli');
    $(this).next('ul').removeClass('dplay').addClass('hide').slideUp();
  }else{
    $(this).parent('li').siblings().children(":last-child").removeClass('dplay').addClass('hide');
    $(this).parent('li').addClass('hideli');
    $(this).parent('li').siblings().removeClass('hideli');
    $(this).next('ul').removeClass('hide').addClass('dplay').slideDown();
  }
});

$('.menu>li').bind('mouseenter',function () {
  if($(this).hasClass('active')){
  }else{
    $(this).addClass('active');
    $(this).siblings('li').removeClass('active');
  }
});

效果: