文章出處

返回目錄

在寫完首篇cache文章后,有些朋友給我來信,希望可以使用JS的方法來實現這個導航功能,所以,才有了這篇文章,JS與C#不同,它雖然有引用類型,但它不具備一些引用類型的特性,如它的方法參數為對象時,也是通過值傳遞的,而不是通過內存地址,而在進行導航制作時,我們正是使用了引用類型的這個特性,所以,我們的JS方法,就不能和C#相同了,如果使用其它方式,如,使用名稱保存在一個變量里。

下面是JS方式實現的導航,希望對JS朋友有些幫助

<script type="text/javascript">

        //對象實體
        var BannerModel = function (name, url, id, parentID) {
            return {
                Name: name,
                Url: url,
                ID: id,
                ParentID: parentID,
                Parent: {}
            };
        }
        var BannerStr = "";
        var Data = [new BannerModel("首頁", "/", 1, 0), new BannerModel("用戶中心", "/UserInfo", 2, 1), new BannerModel("基本信息設置", "/UserInfoSet", 3, 2)];
        //找老祖宗...
   
function GetParent(o) { if (o != undefined && o.ID != undefined) { BannerStr = "<a href=" + o.Url + ">" + o.Name + "</a>" + ">" + BannerStr; for (var i in Data) { if (Data[i].ID == o.ParentID) { o.Parent = Data[i]; break; } } GetParent(o.Parent); } } //導航工廠
var BannerFactory = { GetTreeBanner: function (url) { var temp = ""; BannerStr = ""; for (var i in Data) { if (Data[i].Url == url) { temp = Data[i]; break; } } GetParent(temp); return BannerStr; } } document.write(BannerFactory.GetTreeBanner("/UserInfoSet")); </script>

看JS生成的導航截圖

返回目錄


文章列表




Avast logo

Avast 防毒軟體已檢查此封電子郵件的病毒。
www.avast.com


arrow
arrow
    全站熱搜
    創作者介紹
    創作者 大師兄 的頭像
    大師兄

    IT工程師數位筆記本

    大師兄 發表在 痞客邦 留言(0) 人氣()