js開啟新視窗

企業獵人發表於2016-07-13
JS

實際應用：
1window.open('register.php','_parent','',false);在原先標籤開啟
2.
window.open('register.php');在新標籤開啟
3.
window.open("found.php",'found','width=300,height:200');彈出新的視窗，因為定義了寬度。





一. Window 物件



Window 物件是 JavaScript 層級中的頂層物件。



Window 物件代表一個瀏覽器視窗或一個框架。



Window 物件會在 <body> 或 <frameset> 每次出現時被自動建立。



 



二.



open() 方法用於開啟一個新的瀏覽器視窗或查詢一個已命名的視窗。



 



三.



window.open(URL,name,features,replace)




引數
描述

URL
一個可選的字串，宣告瞭要在新視窗中顯示的文件的 URL。如果省略了這個引數，或者它的值是空字串，那麼新視窗就不會顯示任何文件。

name
一個可選的字串，該字串是一個由逗號分隔的特徵列表，其中包括數字、字母和下劃線，該字元宣告瞭新視窗的名稱。這個名稱可以用作標記 <a> 和 <form> 的屬性 target 的值。如果該引數指定了一個已經存在的視窗，那麼 open() 方法就不再建立一個新視窗，而只是返回對指定視窗的引用。在這種情況下，features 將被忽略。

features
一個可選的字串，宣告瞭新視窗要顯示的標準瀏覽器的特徵。如果省略該引數，新視窗將具有所有標準特徵。在視窗特徵這個表格中，我們對該字串的格式進行了詳細的說明。

replace

 




一個可選的布林值。規定了裝載到視窗的 URL 是在視窗的瀏覽歷史中建立一個新條目，還是替換瀏覽歷史中的當前條目。支援下面的值：


  • true - URL 替換瀏覽歷史中的當前條目。
  • false - URL 在瀏覽歷史中建立新的條目。





四.視窗特徵（Window Features）






channelmode=yes|no|1|0
是否使用劇院模式顯示視窗。預設為 no。

directories=yes|no|1|0
是否新增目錄按鈕。預設為 yes。

fullscreen=yes|no|1|0
是否使用全屏模式顯示瀏覽器。預設是 no。處於全屏模式的視窗必須同時處於劇院模式。

height=pixels
視窗文件顯示區的高度。以畫素計。

left=pixels
視窗的 x 座標。以畫素計。

location=yes|no|1|0
是否顯示地址欄位。預設是 yes。

menubar=yes|no|1|0
是否顯示選單欄。預設是 yes。

resizable=yes|no|1|0
視窗是否可調節尺寸。預設是 yes。

scrollbars=yes|no|1|0
是否顯示滾動條。預設是 yes。

status=yes|no|1|0
是否新增狀態列。預設是 yes。

titlebar=yes|no|1|0
是否顯示標題欄。預設是 yes。

toolbar=yes|no|1|0
是否顯示瀏覽器的工具欄。預設是 yes。

top=pixels
視窗的 y 座標。

width=pixels
視窗的文件顯示區的寬度。以畫素計。






 



五.



注意：     



window.open(URL,name,features,replace)



如果name使用名字已經存在，那麼不會建立一個新的視窗，而是會返回對已經存在的視窗的引用。



否則，則建立一個新的視窗。



我就是沒有注意這點，網頁全屏時候，花了很多時間。



 



六.具體業務功能



6.1 開啟一個全屏的視窗



<script type="text/javascript">



window.open("http://google.com/",'新開googleWin',"fullscreen=1")



</script>



 



6.2 使本頁面全屏



解決方案：先開啟一個全屏的目標視窗，然後關閉本視窗。



程式碼：



<script type="text/javascript">



     var url=document.location.href; //獲得本視窗屬性名

      newWin=window.open(url,'','fullscreen=1,scrollbars=0');      

      window.opener=null;//出掉關閉時候的提示視窗

      window.open('','_self'); //ie7      

      window.close();



</script>



 



注意：如果你在open方法中指定第二個引數，併為他賦予特定的值話，那麼第二次使用上面方法，將無法建立新的視窗，因為系統預設的返回已經存在視窗的索引。



 



按ESC退出全屏



<script type="text/javascript">



// Esc退出全屏

      function exitFullScreenMe() 

         { 

             var esc=window.event.keyCode; 

             if(esc==27) //判斷是不是按的Esc鍵,27表示Esc鍵的keyCode. 

             { 

              var url=document.location.href;

              

       win=window.open(url,'','fullscreen=0,directories=1,location=1,menubar=1,resizable=1,scrollbars=1,status=1,titlebar=1,toolbar=1'); //讓新開啟的視窗全屏                          

       

       window.opener=null;//出掉關閉時候的提示視窗 

       window.open('','_self');//ie7          

       window.close(); //先關閉老的視窗          

                 

             } 

         } 

         document.onkeydown = exitFullScreenMe ; //當onkeydown(按鍵觸發) 事件發生時呼叫hotkey函式



</script>



 



6.3同時彈出兩個視窗



<script type="text/javascript">



window.open("http://google.com/",'新開googleWin1',"height=300, width=300, top=0, left=0,toolbar=no, menubar=no, scrollbars=no, resizable=no, location=n o,
 status=no")



window.open("http://google.com/",'新開googleWin2',"height=300, width=300, top=0, left=400,toolbar=no, menubar=no, scrollbars=no, resizable=no, location=n
 o, status=no")

</script>



注意：（1）視窗的名字不能相同，但可以都為空；



（2）要注意兩個視窗的佈局，是否符合你的要求。



 



6.4



第一次進入頁面才彈出視窗.cookie解決



首先，將如下程式碼加入主頁面HTML的<HEAD>區：



　　<script> 

　　function openwin(){ 

　　window.open("page.html","","width=200,height=200") 

　　} 

　　function get_cookie(Name) { 

　　var search = Name + "=" 

　　var returnvalue = ""; 

　　if (document.cookie.length > 0) { 

　　offset = document.cookie.indexOf(search) 

　　if (offset != -1) { 

　　offset += search.length 

　　end = document.cookie.indexOf(";", offset); 

　　if (end == -1) 

　　end = document.cookie.length; 

　　returnvalue=unescape(document.cookie.substring(offset, end)) 

　　} 

　　} 

　　return returnvalue; 

　　} 　

　　function loadpopup(){ 

　　if (get_cookie('popped')==''){ 

　　openwin() 

　　document.cookie="popped=yes" 

　　} 

　　} 

　　</script>



　　然後，用<body onload="loadpopup()">（注意不是openwin而是loadpop啊！）替換主頁面中原有的<BODY>這一句即可。你可以試著重新整理一下這個頁面或重新進 入該頁面，視窗再也不會彈出了。

          




相關文章