AJAX筆記之三:UpdateProgress

來源:互聯網
上載者:User
UpdateProgress 的使用方法非常簡單, 但是卻非常有用. 以下先示範它的用法:

<1>. 向頁面添加一個updatePanel, 並在裡面放一個label 和一個button .
<2>.添加一個UpdateProgress 控制項, 並把它的AssociatedUpdatePanelID 屬性設定為以上updatePanel的名稱.
<3>.切換到"源" 視圖, 編輯UpdateProgress 的ProgressTemplate 節點:

    <asp:UpdateProgress AssociatedUpdatePanelID="upInq" ID="upgCUser" runat="server" >
        <ProgressTemplate>
            <img id="imgUpg" alt="" src="resources/wait.gif" runat="server" /><span style="COLOR: #ff0000">正在擷取資料 </span>
        </ProgressTemplate>
    </asp:UpdateProgress>

<4>設定button的點擊事件代碼:
system.threading.thread.sleep(4000);
<5>好啦, 運行項目, 點擊按鈕, 就會發現一個旋轉的小表徵圖(當然, 取決於你的圖片), 和一串紅色的字: 正在擷取資料, 4秒後, 自動消失.

需要說明的是: 圖片是不一定需要的, 也可以只有文字, 在ProgressTemplate 之間的內容是可以隨意編輯的, 可以是任意的元素. 另外, 它的DisplayAfter 屬性的預設值500 就是比較合適的值, 不建議修改. 這是以毫秒為單位的等待的時間, 當超過這個時間, 它就顯示出來, 當updatePanel 更新完畢, 它就隱藏.  所以, 如果把這個時間設定得過短, 每次都會看到UpdateProgress 閃來閃去, 非常影響使用者體驗.

如果是區域網路應用, 伺服器總是會很快返回, 就沒有必要使用這個控制項.

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.