当用户单击母版页中的菜单项时,如何防止整页的闪烁

时间:2013-01-04 08:37:20

标签: asp.net updatepanel postback menuitem flicker

当用户点击母版页中的菜单项时,是否可以避免页面闪烁?我尝试了不同的方法来避免这种情况,例如在

中包含的母版页中使用<asp:UpdatePanel runat="server" ID="updateMenu"
            <div class="main">
                <asp:ContentPlaceHolder ID="MainContent" runat="server" />
            </div>` but it doesn't work. 

我的代码是那样的

         <asp:Menu  ID="NavigationMenu" runat="server" Orientation="Horizontal"> 

            <Items>
                    <asp:MenuItem NavigateUrl="~/home.aspx" Text="Home"/>
                    <asp:MenuItem NavigateUrl="~/welcome.aspx" Text="Welcome"/>
                    <asp:MenuItem NavigateUrl="~/item.aspx" Text="Item"/>
            </Items>
        </asp:Menu>  

自Response.Redirect强制刷新页面以来,属性NavigateUrl是否像Response.Redirect()方法一样工作。

如果我使用网站地图会解决我的问题吗?

请帮帮我。 任何建议将不胜感激。

2 个答案:

答案 0 :(得分:0)

NavigateUrl只不过是链接中的href。如果你看一下渲染的HTML,你可能会看到一个带有href到home.aspx或welcome.aspx的'a'标签。

加载新的(网页)页面总会导致某种闪烁,因为您告诉浏览器丢弃它现在拥有的页面并从服务器获取并呈现新页面。无论您是通过菜单,链接还是基于站点地图,都不会改变。

您可以做的最大限度地减少闪烁的一件事是创建一个默认页面,其中包含您需要的所有默认元素,并为页面特定内容添加占位符。接下来,您可以使用要加载的页面的特定内容替换占位符的内容。这将减少但不能消除闪烁,因为仍然需要从服务器获取(部分)网页并用新的HTML替换当前的HTML。

另一种方法是在页面中添加所有内容并隐藏/显示您需要的项目。这虽然采用了完全不同的导航方法,但可能会破坏您的网站/ Web应用程序现在的结构。

希望这有帮助

答案 1 :(得分:0)

MenuItem控件会显示指向NavigateUrl中设置的页面/资源的链接。因此,每次单击链接时,都会加载新页面。是的,它与Response.Redirect()

类似

如果你想避免这种“闪烁”,那么你应该考虑通过Ajax加载你的页面内容。我会避免使用UpdatePanel,因为这总是会将整个页面发回给自己。

所以我建议搜索并查看通过Ajax加载页面内容,或者看看这个SO问题的启动器

Is pjax the way to go for "fluid" navigation?