1. 程式人生 > >easy ui 彈框疊加問題

easy ui 彈框疊加問題

span right net 技術 但是 div spa easyu render

1.框架用的是.net MVC,Index頁面如下所示:

 1 @{
 2     Layout = "~/Views/Shared/_CustomerLayout.cshtml";
 3     ViewBag.Title = "Index";
 4 }
 5 <script>
 6 
 7     function LoadContent(contenturl) {
 8         $("#rightcontent").load(contenturl);
 9     }
10 
11 </script>
12 <div class="clearfix">
13
<div id="leftmenu" class="v_leftMenu"> 14 @{Html.RenderPartial("Menu");} 15 </div> 16 <div id="rightcontent" class="v_rightContent"> 17 @{Html.RenderPartial("Content");} 18 </div> 19 </div>
_CustomerLayout.cshtml中的整體布局如下:
<body>
    @
*頭部*@ <div class="navbar-inverse v_header"> </div> @RenderBody() @*底部*@ <div class="ft"> </div> </body>

2.問題描述:後臺用的easyui框架,我發現每點擊一個彈框,easyui就會自動生成如下代碼:

技術分享圖片

當點擊多次,彈框會疊加

技術分享圖片

3.解決方法:

在Index頁面中的load方法之前,將這些彈框清除掉即可。

 1 @{
 2     Layout = "~/Views/Shared/_CustomerLayout.cshtml";
3 ViewBag.Title = "Index"; 4 } 5 <script> 6 7 function LoadContent(contenturl) { 8 //清除之前的彈框 9 $(‘.panel‘).remove(); 10 $(‘.window-shadow‘).remove(); 11 $(‘.window-mask‘).remove(); 12 $("#rightcontent").load(contenturl); 13 } 14 15 </script> 16 <div class="clearfix"> 17 <div id="leftmenu" class="v_leftMenu"> 18 @{Html.RenderPartial("Menu");} 19 </div> 20 <div id="rightcontent" class="v_rightContent"> 21 @{Html.RenderPartial("Content");} 22 </div> 23 </div>

之前我以為是Html.RenderPartial的原因,總是順著這個方向找,結果沒有找到;後來經提醒,才恍然大悟,原來是easyui根據頁面中easyui-dialog自動生成彈框,生成的彈框在rightcontent之外,所以點擊左側菜單,rightcontent重新加載,但是並不會將彈框清除掉。

技術分享圖片

感悟:easyui自己不是太熟,還是需要多研究多練習,加油!

easy ui 彈框疊加問題