easyUI--局部刷新

最新推荐文章于 2025-06-20 14:00:32 发布

原创最新推荐文章于 2025-06-20 14:00:32 发布 · 6.9k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#easyui

easyUI 专栏收录该内容

1 篇文章

订阅专栏

本文介绍如何利用easyUI在项目中实现局部刷新功能，特别是当右侧内容页面新增内容时，如何同步更新左侧导航。通过获取父页面元素，结合panel的refresh方法，可以实现这一目标。参考链接提供了相关实现思路。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

用easyUI完成的项目
项目截图

代码结构大致是

<div class="easyui-layout"  style="width: 100%; height: 100%;">
    <div data-options="region:'north'" style="height: 50px">
        //头部
        <jsp:include page="/webpage/common/header.jsp" flush="true"></jsp:include>
    </div>
    <div id="cc" data-options="region:'west',split:true"
        style="width: 250px; background: #2d353c;">
        //左侧导航
        <jsp:include page="/webpage/common/sidebar.jsp"></jsp:include>
    </div>
    <div data-options="region:'center',iconCls:'icon-ok'">
        <div id="mainTabs" class="easyui-tabs"
            data-options="fit:true,border:false,plain:true">
            //右侧内容页面
        </div>
    </div>
</div>

想实现的功能是：
右侧内容页面新增加一个邮件名称，左侧导航也动态增加一个相应邮件名称导航

目前找到的解决思路：
在添加邮件的右侧子页面内获取父页面的元素并找到父页面里左侧导航的元素
parent.$(“#cc”)
参考网站http://www.cnblogs.com/puke/archive/2012/09/13/2683067.html
然后用panel的refresh方法实现局部刷新
parent.$(“#cc”).panel(‘refresh’,URL) //这里可以传递一个URL
easyUI panel面板的介绍
 easyUI layout的介绍