js:限制頁面必須在框架內·完美版:保證父框架啟動的后,自動打開原來頁面!(文字修改)

asp.net支持母板頁了,這是一個相當強大而實用的功能,不過iframe框架頁面還有它的生存空間。比如說網站的后臺管理界面,比如說應用軟件。

 

使用框架頁有一個事情需要注意,那就是打開子頁面的時候需要保存子頁面始終被嵌套在父頁面的里面。解決這個問題有一個簡單的辦法,就是在子頁面里面加上一段js:

 

    if (top.location == self.location) { 
        top.location='index.htm';
    }

這段代碼的意思就是,現在整個瀏覽器窗口中,最上面層次的頁面是不是當前頁面?如果是的話,那就打開父框架頁面。

 這段代碼很簡單,也很簡陋,之前網絡上的介紹都是只給出了這樣的“半個解決方案”,實際的效果是:你要打開a.htm頁面(我們稱之為原始請求),a.htm頁面運行上面的代碼,啟動了index.htm。這個時候,index.htm里面有一個框架,框架卻默認打開另一個頁面w.htm。當然,通常情況下,在index.htm里面,我們可能會加上一個指向a的鏈接。進入index.htm之后點擊鏈接,重新打開A頁面。

但是這樣子不好,打斷了用戶體驗。

就有用戶提出:我想看a.htm,打開之后卻跳了w.htm,然后我還得去找到a.htm鏈接再打開。

所以,我最后決定,要找到一個比較完善的方案:請求a.htm,啟動index.htm,index.htm再通過框架啟動a.htm。頁面雖然有一些切換,但是能保證,用戶想看到a.htm結果看到的也就是a.htm,并且a.htm還被index.htm的框架包著。 

我曾經想過一個解決辦法:向index.htm傳遞url參數。比如:top.location='index.htm?url=a.html'   這個辦法用了一段時間,后來發現這個辦法也有缺陷。出現問題的狀況是這樣的:a.html放在admin/下面,index.htm也放在admin/下面。在地址欄里輸入admin/a.html,結果打開admin/index.htm?url =http://localhost/xxxx/admin/a.html

而且在index.htm也正常顯示了A頁面。

 

但是,admin這個目錄是需要用戶權限的。當admin/index.htm?url =http://localhost/xxxx/admin/a.html超時之后,asp.net把頁面跳轉到了/user_login.aspx。這時候的地址欄是http://localhost:xxxxx/xxxx/user_login.aspx?return=admin/index.htm?url =http://localhost/xxxx/admin/a.html!并且報錯!

 

于是我就想到了用cookies。并且,基本上已經成功了。


下面是主要功能說明:

  • 主要用于框架(iframe)程序
  • 現在演示的是htm頁面,也適用于asp/asp.net,當然jsp或者php也應該能用,不過我本人不感興趣,沒有測試過。
  • 打開目標頁面(a.html)之后,目標頁面后自動啟動父框架文件(index.htm)。
  • 目標頁面啟動父框架之前,會把目標頁面的地址存入cookies,父框架啟動后讀取cookies,并且用目標頁面替換掉,默認頁面。
  • 容錯一:父框架讀取cookies之后設置cookies失效。
  • 容錯二:存入cookies時,指定了path(也可以指定domain),防止進入不合適的路徑下讀取cookies錯誤。
  • 可以通過UrlRegEx()函數動態獲取路徑和域名。

a.html里的主要代碼:

 

  1.    if (top.location == self.location) {    
  2.        addCookie('adminGoto',self.location.href,2,getPath());   
  3.         //alert('all cookie:\n' + document.cookie + '\n\n adminGoto' + getCookie('adminGoto'));   
  4.        top.location='index.htm';   
  5.    }    
  6. function getPath()   
  7. {   
  8.     return UrlRegEx(location.href)[4];     
  9. }   
  10.   
  11.      
 

index.htm的主要代碼(里面保留了,通過url跳轉的代碼)

  1.  function getRequestQueryString(key)   
  2.  {   
  3.      var QueryString = location.search;   
  4.      if(QueryString.indexOf("?")!= -1)   
  5.      {   
  6.          var str = QueryString.substr(1);   
  7.          var arr = str.split("&");   
  8.          for(var i = 0 ; i<arr.length; i++)   
  9.          {   
  10.              if(key == arr[i].split("=")[0])   
  11.              {   
  12.                  return arr[i].split("=")[1];               
  13.              }   
  14.          }   
  15.      }   
  16.      return null;   
  17.  }   
  18.        
  19.      if(getRequestQueryString("url")){   
  20. location.href = 'index.aspx';   
  21.          mainFrame.src = getRequestQueryString("url");   
  22.      }   
  23.      if(getCookie('adminGoto') != '')   
  24.      {   
  25. var mainFrame = $('mainFrame');   
  26.          mainFrame.src = getCookie('adminGoto');           
  27.          delCookie('adminGoto');   
  28.      }  

comm.js是分離出來的js代碼,主要包含兩部分內容:操作cookie,通過url獲取域名、路徑、文件名等。

示例下載(csdn)

注意:一個網友來信說代碼不能正常運行,結果我檢查發現“C:\MxDownload\xpnew_code\xpnew_code\a.html”這種方式測試肯定是不行的,因為我的正則里面不能解析這種地址。

http://download.csdn.net/source/564196

關于更新:

程序不斷完善中,最新版本請留意我的博客http://blog.csdn.net/xpnew/或者http://xpnew.cnblogs.com/

歡迎提出批評和建議,那是我的榮幸,來信請寄:xpnew#126.com(請替換#為@)。
特別感謝:無憂腳本、csdn、博客園(排名不分先后)

posted @ 2008-07-31 17:11  柳城之城  閱讀(...)  評論(...編輯  收藏
三d开奖结果走势图