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