js快顯視窗和對話方塊

來源:互聯網
上載者:User

js概述:Window對象是用戶端javascript最高層對象之一,只要開啟瀏覽器視窗,不管該視窗中是否有開啟的網頁

,當遇到BODY、FRAMESET或FRAME元素時,都會自動建立window對象的執行個體。另外,該對象的執行個體也可由

window.open()方法建立。由於window對象是其它大部分對象的共同祖先,在調用window對象的方法和屬

性時,可以省略window對象的引用。例如:window.document.write()可以簡寫成: document.write()。

  在視窗中觖發本視窗對象的任何方法和屬性時可以省去視窗的執行個體名稱。例如給當前的myWin視窗設定

status屬性時,可以只用status而不用myWin.status。但是,在事件處理中調用location屬性、close()

方法或open()方法時必須使用執行個體名稱。

window對象和方法一覽:
它是一個頂層對象,而不是另一個對象的屬性即瀏覽器的視窗。

   屬性======
  defaultStatus 預設的狀態條訊息
    status 狀態條中的訊息
    statusbar
    statusbar.visible
  document 當前顯示的文檔(該屬性本身也是一個對象)
  frames列舉視窗的架構對象的數組,按照這些對象在文檔中出現的順序列出(該屬性本身也是一個對象

)
  history 視窗的曆史列表(該屬性本身也是一個對象)
  length 視窗內的架構數
  location 視窗所顯示文檔的完整(絕對)URL(該屬性本身也是一個對象)不要把它與如

document.location混淆,後者是當前顯示文檔的URL。使用者可以改變window.location(用另一個文檔取代

當前文檔),但卻不能改變document.location(因為這是當前顯示文檔的位置)
  name 視窗開啟時,賦予該視窗的名字
  opener 代表使用window.open開啟當前視窗的指令碼所在的視窗(這是Netscape Navigator 3.0beta 3

所引入的一個新屬性)
  parent 包含當前架構的視窗的同義字。frame和window對象的一個屬性
  self 當前視窗或架構的同義字
  
  top 包含當前架構的最頂層瀏覽器視窗的同義字
  window 當前視窗或架構的同義字,與self相同
    event
   
 
    方法======
  alert() 開啟一個Alert訊息框
  clearTimeout() 用來終止setTimeout方法的工作
  close() 關閉視窗
  confirm() 開啟一個Confirm訊息框,使用者可以選擇OK或Cancel,如果使用者單擊OK,該方法返回true,單

擊Cancel返回false
  blur() 把焦點從指定視窗移開(這是Netscape Navigator 3.0 beta 3引入的新方法)
  focus() 把指定的視窗帶到前台(另一個新方法)
  open() 開啟一個新視窗
  prompt() 開啟一個Prompt對話方塊,使用者可向該框鍵入文本,並把鍵入的文字返回到指令碼
  setTimeout() 等待一段指定的毫秒數時間,然後運行指令事件處理常式

比較常用的方法:
alert/:alert('----'); 無返回
promote/
confirm/ confirm('確定退出嗎?')  點擊確定返回true,取消返回false
setTimeout/ setTimeout(fucntion,10) 延遲10毫秒,執行function
clearTimeout/ 用法clearTimeout(fucntion)
setInterval/ window.setInterval(代碼字元運算式,10) 每間隔10秒執行一次指定的運算式
clearInterval clearInterval(function)

注意:上面的setTimeout和setInterval的第一個參數都可以是字串,也可以是指標,如果是字串,

則行如“function()”,如果用指標,則唯寫function名稱,不用帶後面的括弧
使用清楚函數時,clearTimeout,clearInterval的參數是定時器,也就是上面兩個函數的傳回值,因此

調用如下:
var im = setInterval("function1()",5000);
clearInterval(im);(setTimeout調用完全一樣)

 

js的快顯視窗:
方法:window.open(url,name,dialogattrs) 第二、三參數不是必需的
作用:開啟一個新視窗,名為name,表單內容是url,視窗參數為dialogattrs
參數說明:
url:彈出頁面地址
name:視窗名稱
dialogattrs:視窗的樣式控制參數

視窗風格有以下選項,這些選項可以多選,如果多選,各選項之間用逗號分隔:
toolbar:指定視窗是否有標準工具列。當該選項的值為1或yes時,表示有標準
工具列,當該選項的值為0或no時,表示沒有標準工具列;
location:指定視窗是否有地址工具列,選項的值及含義與toolbar相同;
directories:指定視窗是否有連結工具列,選項的值及含義與toolbar相同;
status:指定視窗是否有狀態列,選項的值及含義與toolbar相同;
menubar:指定視窗是否有菜單,選項的值及含義與toolbar相同;
scrollbar:指定當前視窗文檔大於視窗時是否有捲軸,選項的值及含義與toolbar相同;
resizable:指定視窗是否可改變大小,選項的值及含義與toolbar相同;
width:以像素為單位指定視窗的寬度,已被innerWidth取代;
height:以像素為單位指定視窗的高度,已被innerHeight取代;
outerWidth:以像素為單位指定視窗的外部寬度;
outerHeight:以像素為單位指定視窗的外部高度;
left:以像素為單位指定視窗距螢幕左邊的位置;
top:以像素為單位指定視窗距螢幕頂端的位置;
alwaysLowered:指定視窗隱藏在所有視窗之後,選項的值及含義與toolbar相同;
alwaysRaised:指定視窗浮在所有視窗之上,選項的值及含義與toolbar相同;
dependent:指定開啟的視窗為當前視窗的一個子視窗,並隨著父視窗的關閉而關閉,選項的值及含義與

toolbar相同;

hotkeys:在沒有功能表列的新視窗中設定安全退出的熱鍵,選項的值及含義與toolbar相同;

innerHeight:設定視窗中文檔的像素高度;

innerWidth:設定視窗中文檔的像素寬度;

screenX:設定視窗距離螢幕左邊界的像素長度;

screenY:設定視窗距離螢幕上邊界的像素長度;

titleBar:指明標題列是否在新視窗中可見,選項的值及含義與toolbar相同;

z-look:指明當視窗被啟用時,不能浮在其它視窗之上,選項的值及含義與toolbar相同。
例:window.open('test.html','testwindow','')

 

js中的對話方塊:
js的對話方塊分為強制回應對話方塊(必須關閉對話方塊才能繼續才做)和非強制回應對話方塊(無限制)
強制回應對話方塊文法:
window.showModalDialog(url,args,dialogattrs)
參數說明: 
url:彈出頁面地址
agrs:主視窗傳給對話方塊的參數,可以是任意類型(數組也可以)
dialogattrs:快顯視窗的樣式參數

簡單說明:
1、第二、三個參數都不是必需的
2、agrs參數可以在對話方塊中通過window.dialogArguments擷取,即:

varargus=window.dialogArguments;然後就可以根據實際要求對此進行處理;
3、dialogattrs
選擇性參數,類型:字串。用來描述對話方塊的外觀等資訊,可以使用以下的一個或幾個,用分號“;”隔

開。
 dialogHeight 對話方塊高度,不小於100px,IE4中dialogHeight 和 dialogWidth 預設的單位是em

,而IE5中是px,為方便其見,在定義modal方式的對話方塊時,用px做單位。
 dialogWidth: 對話方塊寬度。
 dialogLeft: 距離案頭左的距離。
 dialogTop: 離案頭上的距離。
 center: {yes | no | 1 | 0 }:視窗是否置中,預設yes,但仍可以指定高度和寬度。
 help: {yes | no | 1 | 0 }:是否顯示協助按鈕,預設yes。
 resizable: {yes | no | 1 | 0 } [IE5+]:是否可被改變大小。預設no。
 status: {yes | no | 1 | 0 } [IE5+]:是否顯示狀態列。預設為yes[ Modeless]或no  [Modal]。
 scroll:{ yes | no | 1 | 0 | on | off }:指明對話方塊是否顯示捲軸。預設為yes。
4、函數有傳回值

強制回應對話方塊用法:
主視窗:var value =window.showModalDialog('test.jsp',strs,'resizable:yes');
彈出框中通過window.returnValue來設定傳回值,上面的value拿到的就是這個值,然後主視窗中可以對

這個值進行處理,實現互動處理
註:強制回應對話方塊的應用就在於它的傳回值,可以返回簡單字元竄,也可以返回數組,非強制回應對話方塊類似

聯繫我們

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