后台管理系统菜单点击不刷新页面,只刷新主体部分

layui框架后台模板

1、利用iframe标签

  <div class="layui-body">
    <!-- 内容主体区域 -->
    <div style="padding: 15px;">
    	<iframe class="layadmin-iframe ifrem_voice" src="welcome.html" width="100%" height="700px"frameborder="0" name="voiceList" scrolling="no"></iframe>
    </div>
  </div>

主体部分就写一个iframe标签,然后命名name,src可以是初始的。
然后菜单的target标签就填name来绑定。

        <li class="layui-nav-item">
          <a class="" href="javascript:;">录音管理</a>
          <dl class="layui-nav-child">
            <dd><a href="uploadVoice.html" target="voiceList">录音上传</a></dd>
            <dd><a href="voiceList.html" id="voiceList" onclick="voiceList" target="voiceList">录音列表</a></dd>
          </dl>
        </li>

2、效果展示
进去就是默认的欢迎页面
后台管理系统菜单点击不刷新页面,只刷新主体部分
点击录音列表就可以切换到录音列表页面,而且不会刷新菜单,非常简单实用。
后台管理系统菜单点击不刷新页面,只刷新主体部分