AI智能應用開發(fā)（Java）
鴻蒙應用開發(fā)
HTML&JS+前端
Python+大數(shù)據(jù)開發(fā)
人工智能開發(fā)
跨境電商
電商視覺設計
軟件測試
新媒體+短視頻
集成電路應用開發(fā)
C/C++
狂野架構師
IP短視頻
web前端開發(fā)培訓之超強的JS總結（一）
更新時間:2016年10月12日14時45分 來源:傳智播客前端與移動開發(fā)學院 瀏覽次數(shù):
1. 清除視窗或frame中的內容
document.clear();
document.close(); document.open(); document.write(“”);
2. 在不同文件之間穿梭
document.back(); document.forward();
history.go(-1); history.go(1);
3. 輸入框
var the_url = prompt("What's the URL?","");
if（the_url==””||the_url==null）{
the_url=”www.google.com”;
}
注：利用the_url==null可以判斷選取的是取消按鈕
4. 確定框
<script language="javascript">
function delete_confirm(qyyb_no,inspect_time,company_name){
<!—點擊確定按鈕-- >
if(confirm("確定要刪除該企業(yè)月報嗎？"))
{
location.href='<%=request.getContextPath()%>/webcontroller?functionId=2015&inspect_time='+inspect_time+'&company_name='+company_name+'&qyyb_no='+qyyb_no;
alert('企業(yè)月報刪除成功！');
window.close();
}
<!—點擊取消按鈕-- >
else{
}
}
</script>
5. 內置變量top，該變量永遠指分割窗口最高層次的瀏覽器窗口。如果你計劃從分割窗口的最高層次開始執(zhí)行命令，你就可以用top變量。
<a href="#" onClick="top.target_frame.document.writeln('Monkey do!<br>');">Monkey see</a>
執(zhí)行該語句時，JavaScript從窗口等級的最高層開始，該層中包含著分割窗口的窗框，從中發(fā)現(xiàn)名叫target_frame的分割窗口，由于該分割窗口是也一個窗口，所它具有窗口的文件（document）屬性。JavaScript找到其document屬性，并調用writeln()方法。其執(zhí)行結果是在文件中寫出"Monkey do!" 。writeln()是文件（document）對象的方法，所以我們必須寫document.writeln()
6. 窗口有一個屬性叫做document，它用于引用到窗口中實際的HTML文件。該document
屬性本身就是一個對象。在談到圖象掉換（image swap）的時候，我們見到過這樣的例子。你可以用下列語句作圖象掉換:
<a href="#">交換</a>
上述語句的意思是說：找到window的document屬性，找到the_image的src屬性并將其設置為圖象button_d.gif。這樣寫是因為窗口（windows）是對象，窗口內的文件（documents）是對象，而文件（document）內的圖象（images）頁是對象。
看起來似乎很復雜，但它的結構很清楚。JavaScript的文件對象模塊（Document Object Model）描述了對象之間的等級關系。
7. Windows特性： window.open()中的第三個參數(shù)是你想要你的窗口表現(xiàn)的一組特性。如果你不完全確定你的參數(shù)，則以用戶瀏覽器的缺省值替代。
然而，如果你指定了一些特性參數(shù)，則窗口將以參數(shù)設定值規(guī)定的出現(xiàn)。特性參數(shù)是以一組逗號分隔的序列出現(xiàn)的。
例如，如果你是這么寫的：
window.open("some_url","window_name","location,menubar");
你將得到一個規(guī)定了URL，窗口名及菜單條（文件，編輯條等等）的窗口。注意別在字符串中加入任何空格，這將使得有些瀏覽器出錯。
看一下另一個例子：
window.open("some_url","window_name","location,height=100,width=100");
這將打開一個高寬各為100像素的窗口。再次請注意別在字符串中加空格。
這里是一組可以在字符串中引用的特性參數(shù)：
menubar （菜單條）
這是個在大多數(shù)軟件應用中都引用的函數(shù)行。一般包括有文件，編輯及其他一些條目。
status（狀態(tài)條）
這是位于你的窗口下部的信息條。當你的鼠標移到一個鏈接上時，鏈接的URL就在這個狀態(tài)條上出現(xiàn)。你可以將狀態(tài)條上顯示的內容搬到一個滾動的marquee 中去。我不打算為你做這個示例，如果你想知道怎樣做，自己設法解決！
scrollbars （滾動條）
當需要時允許滾動條出現(xiàn)。
resizable （重調）
當重調參數(shù)被列出，窗口將可被重調。注意它的拼法，我就經常搞錯。
width （寬度）
以像素點表達的窗口寬。
height（高度）
以像素點表達的窗口高。
toolbar （工具條）
Home button, among others.
瀏覽器工具條，包括后退，前進鈕，停止鈕，以及HOME鈕等等。
location （定位區(qū)）
你可以鍵入URL 的瀏覽器文本區(qū)。
directories （指示區(qū)）
如Netscape瀏覽器中所在的"What's new," "What's cool,"等等。
8、showModalDialog和showModelessDialog
Javascript有許多內建的方法來產生對話框，如：window.alert(), window.confirm(),window.prompt().等。然而IE提供更多的方法支持對話框。如：
showModalDialog() (IE 4+ 支持)
showModelessDialog() (IE 5+ 支持)
window.showModalDialog()方法用來創(chuàng)建一個顯示HTML內容的模態(tài)對話框，由于是對話框，因此它并沒有一般用window.open()打開的窗口的所有屬性。
window.showModelessDialog()方法用來創(chuàng)建一個顯示HTML內容的非模態(tài)對話框。
當我們用showModelessDialog()打開窗口時，不必用window.close()去關閉它，當以非模態(tài)方式［IE5］打開時，打開對話框的窗口仍可以進行其他的操作，即對話框不總是最上面的焦點，當打開它的窗口ＵＲＬ改變時，它自動關閉。而模態(tài)［ＩＥ４］方式的對話框始終有焦點（焦點不可移走，直到它關閉）。模態(tài)對話框和打開它的窗口相聯(lián)系，因此我們打開另外的窗口時，他們的鏈接關系依然保存，并且隱藏在活動窗口的下面。
使用方法如下：
vReturnValue = window.showModalDialog(sURL [, vArguments][, sFeatures])
vReturnValue = window.showModelessDialog(sURL [, vArguments][, sFeatures])
參數(shù)說明：
sURL
必選參數(shù)，類型：字符串。用來指定對話框要顯示的文檔的URL。
vArguments
可選參數(shù)，類型：變體。用來向對話框傳遞參數(shù)。傳遞的參數(shù)類型不限，包括數(shù)組等。對話框通過window.dialogArguments來取得傳遞進來的參數(shù)。
sFeatures
可選參數(shù)，類型：字符串。用來描述對話框的外觀等信息，可以使用以下的一個或幾個，用分號“;”隔開。
dialogHeight 對話框高度，不小于１００px，ＩＥ４中dialogHeight 和 dialogWidth 默認的單位是em，而ＩＥ５中是px，為方便其見，在定義modal方式的對話框時，用px做單位。
dialogWidth: 對話框寬度。
dialogLeft: 距離桌面左的距離。
dialogTop: 離桌面上的距離。
center: {yes | no | 1 | 0 }：窗口是否居中，默認yes，但仍可以指定高度和寬度。
help: {yes | no | 1 | 0 }：是否顯示幫助按鈕，默認yes。
resizable: {yes | no | 1 | 0 } ［ＩＥ５＋］：是否可被改變大小。默認no。
status: {yes | no | 1 | 0 } ［IE5+］：是否顯示狀態(tài)欄。默認為yes[ Modeless]或no[Modal]。
scroll:{ yes | no | 1 | 0 | on | off }：指明對話框是否顯示滾動條。默認為yes。
還有幾個屬性是用在HTA中的，在一般的網頁中一般不使用。
dialogHide:{ yes | no | 1 | 0 | on | off }：在打印或者打印預覽時對話框是否隱藏。默認為no。
edge:{ sunken | raised }：指明對話框的邊框樣式。默認為raised。
unadorned:{ yes | no | 1 | 0 | on | off }：默認為no。
傳入?yún)?shù)：
要想對話框傳遞參數(shù)，是通過vArguments來進行傳遞的。類型不限制，對于字符串類型，最大為4096個字符。也可以傳遞對象，例如：
test1.htm
====================
<script>
var mxh1 = new Array("mxh","net_lover","孟子E章")
var mxh2 = window.open("about:blank","window_mxh")
// 向對話框傳遞數(shù)組
window.showModalDialog("test2.htm",mxh1)
// 向對話框傳遞window對象
window.showModalDialog("test3.htm",mxh2)
</script>
test2.htm
====================
<script>
var a = window.dialogArguments
alert("您傳遞的參數(shù)為：" + a)
</script>
test3.htm
====================
<script>
var a = window.dialogArguments
alert("您傳遞的參數(shù)為window對象，名稱：" + a.name)
</script>
可以通過window.returnValue向打開對話框的窗口返回信息，當然也可以是對象。例如：
test4.htm
===================
<script>
var a = window.showModalDialog("test5.htm")
for(i=0;i<a.length;i++) alert(a)
</script>
test5.htm
===================
<script>
function sendTo()
{
var a=new Array("a","b")
window.returnValue = a
window.close()
}
</script>
<body>
<form>
<input value="返回" type=button>
</form>
常見問題：
1，如何在模態(tài)對話框中進行提交而不新開窗口？
如果你 的瀏覽器是IE5.5+,可以在對話框中使用帶name屬性的iframe，提交時可以制定target為該iframe的name。對于IE4+，你可以用高度為0的frame來作：例子，
test6.htm
===================
<script>
window.showModalDialog("test7.htm")
</script>
test7.htm
===================
if(window.location.search) alert(window.location.search)
<frameset rows="0,*">
<frame src="about:blank">
<frame src="test8.htm">
</frameset>
test8.htm
===================
<form target="_self" method="get">
<input name=txt value="test">
<input type=submit>
</form>
<script>
if(window.location.search) alert(window.location.search)
</script>
2,可以通過http://servername/virtualdirname/test.htm?name=mxh方式直接向對話框傳遞參數(shù)嗎？
答案是不能。但在frame里是可以的。
showModalDialog和showModelessDialog的異同
同：兩者彈出的窗體不能刷新
異：前者是模態(tài)窗口，始終獲得焦點；后者是非模態(tài)窗口，只不過彈出一個頁面，還可以操作父窗口。
關閉showModalDialog和showModelessDialog彈出的窗口
<INPUT type="button" value="ButtonClick">
怎樣才讓在showModalDialog和showModelessDialog的彈出新窗口里操作button,不彈出新窗口？
在<head>和</head>之間加<base target="_self">
showModalDialog的返回值
參照例子：
t1.html:
<script language="javascript">
function showpage()
{
alert(showModalDialog("t2.html"));
}
</script>
<input type="button" value="getval">
t2.html
<HTML>
<HEAD>
<Script language="javascript">
<
function SetVal()
{
returnValue="abc";
close();
}
//-->
</Script>
</HEAD>
<BODY>
<input type="button" value="Btn1">
</BODY>
</HTML>
window.showModalDialog ("dic_functionlist.jsp?dicid="+id,window,'dialogheight:300pt; dialogwidth:340pt; dialogtop:120pt; dialogleft:240pt;scrollbars:no;resizable:no;location:no;status:no');
9.內置變量是parent，指的是包含當前分割窗口的母窗口。如果在一個窗口內有分割窗口，而在其中的一個分割窗口中又包含著分割窗口，則第2層的分割窗口可以用parent變量引用包含它的母分割窗口。
10. 復選框是否選中
var is_checked =
window.document.the_form.the_checkbox.checked;
if (is_checked == true)
{
alert("Yup, it's checked!");
} else {
alert("Nope, it's not checked.");
}
11. 復選框實例1
<form name="form_1">
<input type="checkbox" name="check_1">Checkbox 1
</form>
<a href="#"
onClick=
"window.document.form_1.check_1.checked=true;
return false;">
Click to check Checkbox 1</a>
<a href="#"box-sizing: border-box; color: rgb(51, 51, 51); font-family: arial, verdana, 'Microsoft YaHei', Tahoma, Simsun, sans-serif; line-height: 25.2px;">return false;">
Click to uncheck Checkbox 1</a>
<a href="#"
onClick="alert(window.document.form_1.check_1.checked);
return false;">
Click to see the value of Checkbox 1</a>
注意我在鏈接中始終加入了return false，以防止瀏覽器刷新頁面又回到原來的內容。
復選框的事件處理器是onClick。當某人點擊復選框時，onClick事件處理器即發(fā)揮作用。
12. 復選框實例2
<form name="form_2">
<input type="checkbox" name ="check_1"
onClick="switchLight();">The Light Switch
</form>
當某人點擊復選框時，onClick處理器被激活并執(zhí)行函數(shù)switchLight()，以下為函數(shù)switchLight() 的編碼（它置于網頁首部中）:
function switchLight()
{
var the_box = window.document.form_2.check_1;
var the_switch = "";
if (the_box.checked == false) {
alert("Hey! Turn that back on!");
document.bgColor='black';
} else {
alert("Thanks!");
document.bgColor='white';
}
}
13. 單選框實例
表單編碼如下
<form name="form_1">
<input type="radio" name ="radio">Light off
<input type="radio" name ="radio" checked>Light on
</form>
當?shù)谝粋€單選框被選中時，函數(shù)offButton() 被調用。函數(shù)如下：
function offButton()
{
var the_box = window.document.form_1.radio[0];
if (the_box.checked == true)
{
window.document.form_1.radio[1].checked = false;
document.bgColor='black';
alert("Hey! Turn that back on!");
}
}
這個例子很象前面的復選框例子，主要的區(qū)別在于該行：
window.document.form_1.radio[1].checked = false;
該行指令指示JavaScript在該按鈕被點擊時關閉另外一個按鈕。由于另外一個按鈕的函數(shù)同這個很相似：
function onButton()
{
var the_box = window.document.form_1.radio[1];
if (the_box.checked == true)
{
window.document.form_1.radio[0].checked = false;
document.bgColor='white';
alert("Thanks!");
}
}
14. 下列選單
<select name="pulldown_1" size=1>
<option>probiscus
<option>spider
<option>lemur
<option>chimp
</select>
注意這個選單的名稱是pulldown_1，但各個選項沒有名稱。所以要調用其中的各個選項則有點困難。
幸好數(shù)組可以幫助我們調用其中的選項。如果你想改變該下列選單中的第2個選項，你可以這樣做：
window.document.form_1.pulldown_1.options[1].text = 'new_text';
這是因為選單的元素有一個選項屬性，而該屬性是選單所有選項的集合而成的數(shù)組。
除了選項屬性，選單還有一項屬性叫做selectedIndex。大筆一個選項被選擇后，selectedIndex屬性將變成被選項的數(shù)組索引號（序列號）。選擇第2個列表選單中的一個選項，然后檢查索引號。記住數(shù)組中的第1個選項的索引號是0。
<a href="#"box-sizing: border-box; color: rgb(51, 51, 51); font-family: arial, verdana, 'Microsoft YaHei', Tahoma, Simsun, sans-serif; line-height: 25.2px;">window.document.form_1.list_1.selectedIndex);
return false;">check the index.</a>
表單的名稱是form_1，列表選單的名稱是list_1。selectedIndex屬性值為
window.document.form_1.list_1.selectedIndex。你還可
以將selectedIndex設置如下：
window.document.form_1.list_1.selectedIndex = 1;
并高亮度顯示第2個選項。一旦你得到被選項的索引號，你就可以發(fā)現(xiàn)其內容：
var the_select = window.document.form_1.list_1;
var the_index = the_select.selectedIndex;
var the_selected = the_select.options[the_index].text;
15. 獲取select組件的被選中的值
function getselected(){
var sel = document.form1.select;
return sel.options[sel.selectedIndex].text;
}
文章轉載于：前端網
本文版權歸傳智播客web前端開發(fā)培訓學院所有，歡迎轉載，轉載請注明作者出處，謝謝！
作者：傳智播客web前端開發(fā)培訓學院
首發(fā)：http://www.futanqicn.cn/web/
document.clear();
document.close(); document.open(); document.write(“”);
2. 在不同文件之間穿梭
document.back(); document.forward();
history.go(-1); history.go(1);
3. 輸入框
var the_url = prompt("What's the URL?","");
if（the_url==””||the_url==null）{
the_url=”www.google.com”;
}
注：利用the_url==null可以判斷選取的是取消按鈕
4. 確定框
<script language="javascript">
function delete_confirm(qyyb_no,inspect_time,company_name){
<!—點擊確定按鈕-- >
if(confirm("確定要刪除該企業(yè)月報嗎？"))
{
location.href='<%=request.getContextPath()%>/webcontroller?functionId=2015&inspect_time='+inspect_time+'&company_name='+company_name+'&qyyb_no='+qyyb_no;
alert('企業(yè)月報刪除成功！');
window.close();
}
<!—點擊取消按鈕-- >
else{
}
}
</script>
5. 內置變量top，該變量永遠指分割窗口最高層次的瀏覽器窗口。如果你計劃從分割窗口的最高層次開始執(zhí)行命令，你就可以用top變量。
<a href="#" onClick="top.target_frame.document.writeln('Monkey do!<br>');">Monkey see</a>
執(zhí)行該語句時，JavaScript從窗口等級的最高層開始，該層中包含著分割窗口的窗框，從中發(fā)現(xiàn)名叫target_frame的分割窗口，由于該分割窗口是也一個窗口，所它具有窗口的文件（document）屬性。JavaScript找到其document屬性，并調用writeln()方法。其執(zhí)行結果是在文件中寫出"Monkey do!" 。writeln()是文件（document）對象的方法，所以我們必須寫document.writeln()
6. 窗口有一個屬性叫做document，它用于引用到窗口中實際的HTML文件。該document
屬性本身就是一個對象。在談到圖象掉換（image swap）的時候，我們見到過這樣的例子。你可以用下列語句作圖象掉換:
<a href="#">交換</a>
上述語句的意思是說：找到window的document屬性，找到the_image的src屬性并將其設置為圖象button_d.gif。這樣寫是因為窗口（windows）是對象，窗口內的文件（documents）是對象，而文件（document）內的圖象（images）頁是對象。
看起來似乎很復雜，但它的結構很清楚。JavaScript的文件對象模塊（Document Object Model）描述了對象之間的等級關系。
7. Windows特性： window.open()中的第三個參數(shù)是你想要你的窗口表現(xiàn)的一組特性。如果你不完全確定你的參數(shù)，則以用戶瀏覽器的缺省值替代。
然而，如果你指定了一些特性參數(shù)，則窗口將以參數(shù)設定值規(guī)定的出現(xiàn)。特性參數(shù)是以一組逗號分隔的序列出現(xiàn)的。
例如，如果你是這么寫的：
window.open("some_url","window_name","location,menubar");
你將得到一個規(guī)定了URL，窗口名及菜單條（文件，編輯條等等）的窗口。注意別在字符串中加入任何空格，這將使得有些瀏覽器出錯。
看一下另一個例子：
window.open("some_url","window_name","location,height=100,width=100");
這將打開一個高寬各為100像素的窗口。再次請注意別在字符串中加空格。
這里是一組可以在字符串中引用的特性參數(shù)：
menubar （菜單條）
這是個在大多數(shù)軟件應用中都引用的函數(shù)行。一般包括有文件，編輯及其他一些條目。
status（狀態(tài)條）
這是位于你的窗口下部的信息條。當你的鼠標移到一個鏈接上時，鏈接的URL就在這個狀態(tài)條上出現(xiàn)。你可以將狀態(tài)條上顯示的內容搬到一個滾動的marquee 中去。我不打算為你做這個示例，如果你想知道怎樣做，自己設法解決！
scrollbars （滾動條）
當需要時允許滾動條出現(xiàn)。
resizable （重調）
當重調參數(shù)被列出，窗口將可被重調。注意它的拼法，我就經常搞錯。
width （寬度）
以像素點表達的窗口寬。
height（高度）
以像素點表達的窗口高。
toolbar （工具條）
Home button, among others.
瀏覽器工具條，包括后退，前進鈕，停止鈕，以及HOME鈕等等。
location （定位區(qū)）
你可以鍵入URL 的瀏覽器文本區(qū)。
directories （指示區(qū)）
如Netscape瀏覽器中所在的"What's new," "What's cool,"等等。
8、showModalDialog和showModelessDialog
Javascript有許多內建的方法來產生對話框，如：window.alert(), window.confirm(),window.prompt().等。然而IE提供更多的方法支持對話框。如：
showModalDialog() (IE 4+ 支持)
showModelessDialog() (IE 5+ 支持)
window.showModalDialog()方法用來創(chuàng)建一個顯示HTML內容的模態(tài)對話框，由于是對話框，因此它并沒有一般用window.open()打開的窗口的所有屬性。
window.showModelessDialog()方法用來創(chuàng)建一個顯示HTML內容的非模態(tài)對話框。
當我們用showModelessDialog()打開窗口時，不必用window.close()去關閉它，當以非模態(tài)方式［IE5］打開時，打開對話框的窗口仍可以進行其他的操作，即對話框不總是最上面的焦點，當打開它的窗口ＵＲＬ改變時，它自動關閉。而模態(tài)［ＩＥ４］方式的對話框始終有焦點（焦點不可移走，直到它關閉）。模態(tài)對話框和打開它的窗口相聯(lián)系，因此我們打開另外的窗口時，他們的鏈接關系依然保存，并且隱藏在活動窗口的下面。
使用方法如下：
vReturnValue = window.showModalDialog(sURL [, vArguments][, sFeatures])
vReturnValue = window.showModelessDialog(sURL [, vArguments][, sFeatures])
參數(shù)說明：
sURL
必選參數(shù)，類型：字符串。用來指定對話框要顯示的文檔的URL。
vArguments
可選參數(shù)，類型：變體。用來向對話框傳遞參數(shù)。傳遞的參數(shù)類型不限，包括數(shù)組等。對話框通過window.dialogArguments來取得傳遞進來的參數(shù)。
sFeatures
可選參數(shù)，類型：字符串。用來描述對話框的外觀等信息，可以使用以下的一個或幾個，用分號“;”隔開。
dialogHeight 對話框高度，不小于１００px，ＩＥ４中dialogHeight 和 dialogWidth 默認的單位是em，而ＩＥ５中是px，為方便其見，在定義modal方式的對話框時，用px做單位。
dialogWidth: 對話框寬度。
dialogLeft: 距離桌面左的距離。
dialogTop: 離桌面上的距離。
center: {yes | no | 1 | 0 }：窗口是否居中，默認yes，但仍可以指定高度和寬度。
help: {yes | no | 1 | 0 }：是否顯示幫助按鈕，默認yes。
resizable: {yes | no | 1 | 0 } ［ＩＥ５＋］：是否可被改變大小。默認no。
status: {yes | no | 1 | 0 } ［IE5+］：是否顯示狀態(tài)欄。默認為yes[ Modeless]或no[Modal]。
scroll:{ yes | no | 1 | 0 | on | off }：指明對話框是否顯示滾動條。默認為yes。
還有幾個屬性是用在HTA中的，在一般的網頁中一般不使用。
dialogHide:{ yes | no | 1 | 0 | on | off }：在打印或者打印預覽時對話框是否隱藏。默認為no。
edge:{ sunken | raised }：指明對話框的邊框樣式。默認為raised。
unadorned:{ yes | no | 1 | 0 | on | off }：默認為no。
傳入?yún)?shù)：
要想對話框傳遞參數(shù)，是通過vArguments來進行傳遞的。類型不限制，對于字符串類型，最大為4096個字符。也可以傳遞對象，例如：
test1.htm
====================
<script>
var mxh1 = new Array("mxh","net_lover","孟子E章")
var mxh2 = window.open("about:blank","window_mxh")
// 向對話框傳遞數(shù)組
window.showModalDialog("test2.htm",mxh1)
// 向對話框傳遞window對象
window.showModalDialog("test3.htm",mxh2)
</script>
test2.htm
====================
<script>
var a = window.dialogArguments
alert("您傳遞的參數(shù)為：" + a)
</script>
test3.htm
====================
<script>
var a = window.dialogArguments
alert("您傳遞的參數(shù)為window對象，名稱：" + a.name)
</script>
可以通過window.returnValue向打開對話框的窗口返回信息，當然也可以是對象。例如：
test4.htm
===================
<script>
var a = window.showModalDialog("test5.htm")
for(i=0;i<a.length;i++) alert(a)
</script>
test5.htm
===================
<script>
function sendTo()
{
var a=new Array("a","b")
window.returnValue = a
window.close()
}
</script>
<body>
<form>
<input value="返回" type=button>
</form>
常見問題：
1，如何在模態(tài)對話框中進行提交而不新開窗口？
如果你 的瀏覽器是IE5.5+,可以在對話框中使用帶name屬性的iframe，提交時可以制定target為該iframe的name。對于IE4+，你可以用高度為0的frame來作：例子，
test6.htm
===================
<script>
window.showModalDialog("test7.htm")
</script>
test7.htm
===================
if(window.location.search) alert(window.location.search)
<frameset rows="0,*">
<frame src="about:blank">
<frame src="test8.htm">
</frameset>
test8.htm
===================
<form target="_self" method="get">
<input name=txt value="test">
<input type=submit>
</form>
<script>
if(window.location.search) alert(window.location.search)
</script>
2,可以通過http://servername/virtualdirname/test.htm?name=mxh方式直接向對話框傳遞參數(shù)嗎？
答案是不能。但在frame里是可以的。
showModalDialog和showModelessDialog的異同
同：兩者彈出的窗體不能刷新
異：前者是模態(tài)窗口，始終獲得焦點；后者是非模態(tài)窗口，只不過彈出一個頁面，還可以操作父窗口。
關閉showModalDialog和showModelessDialog彈出的窗口
<INPUT type="button" value="ButtonClick">
怎樣才讓在showModalDialog和showModelessDialog的彈出新窗口里操作button,不彈出新窗口？
在<head>和</head>之間加<base target="_self">
showModalDialog的返回值
參照例子：
t1.html:
<script language="javascript">
function showpage()
{
alert(showModalDialog("t2.html"));
}
</script>
<input type="button" value="getval">
t2.html
<HTML>
<HEAD>
<Script language="javascript">
<
function SetVal()
{
returnValue="abc";
close();
}
//-->
</Script>
</HEAD>
<BODY>
<input type="button" value="Btn1">
</BODY>
</HTML>
window.showModalDialog ("dic_functionlist.jsp?dicid="+id,window,'dialogheight:300pt; dialogwidth:340pt; dialogtop:120pt; dialogleft:240pt;scrollbars:no;resizable:no;location:no;status:no');
9.內置變量是parent，指的是包含當前分割窗口的母窗口。如果在一個窗口內有分割窗口，而在其中的一個分割窗口中又包含著分割窗口，則第2層的分割窗口可以用parent變量引用包含它的母分割窗口。
10. 復選框是否選中
var is_checked =
window.document.the_form.the_checkbox.checked;
if (is_checked == true)
{
alert("Yup, it's checked!");
} else {
alert("Nope, it's not checked.");
}
11. 復選框實例1
<form name="form_1">
<input type="checkbox" name="check_1">Checkbox 1
</form>
<a href="#"
onClick=
"window.document.form_1.check_1.checked=true;
return false;">
Click to check Checkbox 1</a>
<a href="#"box-sizing: border-box; color: rgb(51, 51, 51); font-family: arial, verdana, 'Microsoft YaHei', Tahoma, Simsun, sans-serif; line-height: 25.2px;">return false;">
Click to uncheck Checkbox 1</a>
<a href="#"
onClick="alert(window.document.form_1.check_1.checked);
return false;">
Click to see the value of Checkbox 1</a>
注意我在鏈接中始終加入了return false，以防止瀏覽器刷新頁面又回到原來的內容。
復選框的事件處理器是onClick。當某人點擊復選框時，onClick事件處理器即發(fā)揮作用。
12. 復選框實例2
<form name="form_2">
<input type="checkbox" name ="check_1"
onClick="switchLight();">The Light Switch
</form>
當某人點擊復選框時，onClick處理器被激活并執(zhí)行函數(shù)switchLight()，以下為函數(shù)switchLight() 的編碼（它置于網頁首部中）:
function switchLight()
{
var the_box = window.document.form_2.check_1;
var the_switch = "";
if (the_box.checked == false) {
alert("Hey! Turn that back on!");
document.bgColor='black';
} else {
alert("Thanks!");
document.bgColor='white';
}
}
13. 單選框實例
表單編碼如下
<form name="form_1">
<input type="radio" name ="radio">Light off
<input type="radio" name ="radio" checked>Light on
</form>
當?shù)谝粋€單選框被選中時，函數(shù)offButton() 被調用。函數(shù)如下：
function offButton()
{
var the_box = window.document.form_1.radio[0];
if (the_box.checked == true)
{
window.document.form_1.radio[1].checked = false;
document.bgColor='black';
alert("Hey! Turn that back on!");
}
}
這個例子很象前面的復選框例子，主要的區(qū)別在于該行：
window.document.form_1.radio[1].checked = false;
該行指令指示JavaScript在該按鈕被點擊時關閉另外一個按鈕。由于另外一個按鈕的函數(shù)同這個很相似：
function onButton()
{
var the_box = window.document.form_1.radio[1];
if (the_box.checked == true)
{
window.document.form_1.radio[0].checked = false;
document.bgColor='white';
alert("Thanks!");
}
}
14. 下列選單
<select name="pulldown_1" size=1>
<option>probiscus
<option>spider
<option>lemur
<option>chimp
</select>
注意這個選單的名稱是pulldown_1，但各個選項沒有名稱。所以要調用其中的各個選項則有點困難。
幸好數(shù)組可以幫助我們調用其中的選項。如果你想改變該下列選單中的第2個選項，你可以這樣做：
window.document.form_1.pulldown_1.options[1].text = 'new_text';
這是因為選單的元素有一個選項屬性，而該屬性是選單所有選項的集合而成的數(shù)組。
除了選項屬性，選單還有一項屬性叫做selectedIndex。大筆一個選項被選擇后，selectedIndex屬性將變成被選項的數(shù)組索引號（序列號）。選擇第2個列表選單中的一個選項，然后檢查索引號。記住數(shù)組中的第1個選項的索引號是0。
<a href="#"box-sizing: border-box; color: rgb(51, 51, 51); font-family: arial, verdana, 'Microsoft YaHei', Tahoma, Simsun, sans-serif; line-height: 25.2px;">window.document.form_1.list_1.selectedIndex);
return false;">check the index.</a>
表單的名稱是form_1，列表選單的名稱是list_1。selectedIndex屬性值為
window.document.form_1.list_1.selectedIndex。你還可
以將selectedIndex設置如下：
window.document.form_1.list_1.selectedIndex = 1;
并高亮度顯示第2個選項。一旦你得到被選項的索引號，你就可以發(fā)現(xiàn)其內容：
var the_select = window.document.form_1.list_1;
var the_index = the_select.selectedIndex;
var the_selected = the_select.options[the_index].text;
15. 獲取select組件的被選中的值
function getselected(){
var sel = document.form1.select;
return sel.options[sel.selectedIndex].text;
}
文章轉載于：前端網
本文版權歸傳智播客web前端開發(fā)培訓學院所有，歡迎轉載，轉載請注明作者出處，謝謝！
作者：傳智播客web前端開發(fā)培訓學院
首發(fā)：http://www.futanqicn.cn/web/
最新資訊
0
分享到：
據(jù)學科列表頁右側.png)
江蘇傳智播客教育科技股份有限公司 版權所有Copyright 2006-2024 All Rights Reserved 蘇ICP備16007882號營業(yè)執(zhí)照增值電信業(yè)務經營許可證出版物經營許可證
蘇公網安備 32132202001156號