Question

我正在使用C＃，Ajax进行编码。

请参阅以下用于ajax实现的代码。

<div id="column2Container">
            <ajax:ScriptManager ID="ScriptManager1" runat="server">
            </ajax:ScriptManager>
            <div id="column2">
                 <ajax:UpdateProgress ID="uprogDestinationsTabs" runat="server" AssociatedUpdatePanelID="upDestinationTabs">
                    <ProgressTemplate>
                        <span style="display: block; text-align: center">
                            <p style="font-family: Verdana; font-size: larger; font-weight: bold;">
                                <img src="/Images/ajax-loader-circle-thickbox.gif" alt="Processing..." /><br />
                                <br />
                                Processing...</p>
                        </span>
                    </ProgressTemplate>
                </ajax:UpdateProgress>
                <ajax:UpdatePanel ID="upDestinationTabs" runat="server" RenderMode="Inline" UpdateMode="Conditional">
                    <ContentTemplate>
                        <CCIT.Web:DestinationTabs runat="server" />
                    </ContentTemplate>
                </ajax:UpdatePanel>
            </div>
</div>

其实我要做的是，你可以看到在updatepanel里面有一个.net usercontrol，即<CCIT.Web:DestinationTabs runat="server" />这个用户控件将在html下面呈现

<ul class="tabHead tabs-nav">
    <li class="tabLeftEnd"></li>
    <li id="tab-1">
    <a class="load-fragment" href="/english/destinations_offers/destinations/asiapacific/india/newdelhi/index.aspx"><span>Overview</span></a>
    </li>
    <li class="tabs-selected" id="tab-2">
    <a href="/english/destinations_offers/destinations/asiapacific/india/newdelhi/guide.aspx"><span>Guide</span></a>
    </li>
    <li id="tab-3">
    <a href="/english/destinations_offers/destinations/asiapacific/india/newdelhi/flightschedule.aspx"><span>Flight Schedule</span></a>
    </li>
    <li id="tab-4">
    <a href="/english/destinations_offers/destinations/asiapacific/india/newdelhi/specialOffers.aspx"><span>Special Offers</span></a>
    </li>
    <li id="tab-5">
    <a class="load-fragment" href="/english/destinations_offers/destinations/asiapacific/india/newdelhi/photo.aspx"><span>Photos</span></a>
    </li>
    <li class="tabRightEnd"></li>
</ul>

现在我要做的是，当用户点击任何应该从Ajax处理的链接时，我的意思是在加载这些页面时不会有任何页面回发，即我为什么要尝试使用更新面板

请注意上述ajax实现中的错误，因为上面的代码对我不起作用。

感谢。

最诚挚的问候， MS

Answer 1

我认为你误解了回发是什么。回发是指将表单的内容发送到服务器进行处理。当用户点击您的某个链接时，它不是回发。没有任何东西被发送回服务器 - 它们只是导航到新页面。

在用户导航到新页面时，在更新面板中使用链接不会阻止屏幕刷新或“闪烁”。这会产生影响的唯一一次是你是否引发回发（例如点击一个按钮）。

在页面之间导航时阻止屏幕刷新的唯一方法是使用AJAX（而不是更新面板）获取页面内容并将其加载到div中。

您可以使用jquery的加载函数来执行此操作：

1）在页面中添加对jquery的引用

<script src="<%=ResolveUrl("~/Scripts/jquery-1.4.1.min.js") %>" type="text/javascript" />

2）在您的页面中添加一个名为divContent

的div

<div id="divContent"></div>

3）将这一点javascript添加到您的页面

<script type="text/javascript">
    function LoadPage(url) {
        $('#divContent').load(url, 'divContent');
    }
</script>

4）让链接看起来像这样：

<a href="javascript: LoadPage('path/to/page.aspx');"><span>Guide</span></a>

如何使用updatepanel停止页面回发

1 个答案: