NET Framework 1.1 中 SmartNavigation 的實現

來源:互聯網
上載者:User
.   SmartNavigation這個Page屬性很有意思,他在不改動(其實是改動很小)頁面元素布局的情況下,居然可以類比出非常平滑的“無重新整理”頁面,為什麼這個“無重新整理”要闊起來呢?其實他是重新整理了的,而且用的也不是什麼xmlhttp也不是xmldom技術,它是事實在在的Submit,可能這樣是為了瀏覽器安全色性什麼的來考慮的吧。
    SmartNavigation的實現原理,其實和我們在動畫繪製中使用的雙緩衝技術及其相似。首先說一下他對普通頁面的改造,他在普通的.aspx頁面的返回結果中,加了兩行代碼,一個是IFrame,一個是JScript指令碼:
...<IFRAME ID=__hifSmartNav NAME=__hifSmartNav STYLE=display:none src="/aspnet_client/system_web/1_1_4322/SmartNav.htm"></IFRAME>

...<script language="JScript" src="/aspnet_client/system_web/1_1_4322/SmartNav.js"></script>

...
    這中間的IFrame(__hifSmartNav)就相當於動畫繪製中的實際繪圖表面,在Smart Navigate中,他就是實際的Submit頁面和資料接收頁面。這一切都是SmartNav.js的傑作,SmartNav.js中使用了一個更有意思的技術,其實是老的不能再老的技術,用現代的話來說就是hook,說遠點和Dos下修改中斷向量有異曲同工之妙。它是怎麼做的呢?其實除了顯示輸出,一切的操作都複製到IFrame裡去執行去了,因為IFrame對象,和Document對象有著最大的相似性,包括屬性和事件等。
    當我們執行enable了SmartNavigation的頁面時,它首先被SmartNav.js引導,這個指令碼中最關鍵的一句就是:var rc = window.__smartNav.attachForm();,他的作用就是把我們當前頁面上的form,封裝到一個叫__smartNav的類中,然後用這個類來操作一切navigate。
    這是SmartNav.js中最關鍵最精彩的代碼:

        if (snfm.__formAttached == true) return true;
        snfm.__formAttached = true;
        snfm.attachEvent("onsubmit", window.__smartNav.init);
        snfm._submit = snfm.submit;
        snfm.submit = window.__smartNav.submit;
        snfm.target = window.__smartNav.hifName;

    他完成了form的attach,同時hook了頁面的submit事件,還在最後一句把__smartNav中form的target設定到了__hifSmartNav(這就是隱藏的那個IFrame)。如果不改變target,那麼submit就把我們的當前form提交了。
    說道這兒已經就沒有什麼好說得了,提交是__hifSmartNav執行的,返回的資料也回到了這個IFrame中,剩下的就是把獲得資料寫回到我們本來的那個document中去,那些代碼比較的複雜,處理的情況也挺多,連標題的更新都是考慮到了的,有興趣就自己去讀讀罷。

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在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.