首页编程dialogarguments 如何关闭showModalDialog窗口

dialogarguments 如何关闭showModalDialog窗口

编程之家2023-11-0673次浏览

你是否想了解更多关于dialogarguments和如何关闭showModalDialog窗口的知识?在本文中,小编将为您详细介绍这两个话题,帮助您更好地理解。

dialogarguments 如何关闭showModalDialog窗口

如何关闭showModalDialog窗口

一、showModalDialog和showModelessDialog有什么不同?

showModalDialog:被打开后就会始终保持输入焦点。除非对话框被关闭,否则用户无法切换到主窗

口。类似alert的运行效果。

showModelessDialog:被打开后,用户可以随机切换输入焦点。对主窗口没有任何影响(最多是被挡

住一下而以。

二、怎样才让在showModalDialog和showModelessDialog的超连接不弹出新窗口?

dialogarguments 如何关闭showModalDialog窗口

在被打开的网页里加上<base target="_self">就可以了。这句话一般是放在<head>之间的。

三、怎样才刷新showModalDialog和showModelessDialog里的内容?

在showModalDialog和showModelessDialog里是不能按F5刷新的,又不能弹出菜单。这个只能依靠

javascript了,以下是相关代码:

<body onkeydown="if(event.keyCode==116){reload.click()}">

<a id="reload" rel="external nofollow" href="filename.htm" style="display:none">reload...</a>

dialogarguments 如何关闭showModalDialog窗口

将filename.htm替换成网页的名字然后将它放到你打开的网页里,按F5就可以刷新了,注意,这个要

配合<base target="_self">使用,不然你按下F5会弹出新窗口的。

四、如何用javascript关掉showModalDialog(或showModelessDialog)打开的窗口。

<input type="button" value="关闭" onclick="window.close()">

也要配合<base target="_self">,不然会打开一个新的IE窗口,然后再关掉的。

五、showModalDialog和showModelessDialog数据传递技巧。

(作者语:本来想用一问一答形式来写的,但是我想不出这个怎么问,所以只好这样了。)

这个东西比较麻烦,我改了好几次了不是没办法说明白(语文水平越来越差了),只好用个例子说明了

例子:

现在需要在一个showModalDialog(或showModelessDialog)里读取或设置一个变量var_name

一般的传递方式:

window.showModalDialog("filename.htm",var_name)

//传递var_name变量

在showModalDialog(或showModelessDialog)读取和设置时:

alert(window.dialogArguments)//读取var_name变量

window.dialogArguments="oyiboy"//设置var_name变量

这种方式是可以满足的,但是当你想在操作var_name同时再操作第二个变理var_id时呢?就无法

再进行操作了。这就是这种传递方式的局限性。

以下是我建议使用的传递方式:

window.showModalDialog("filename.htm",window)

//不管要操作什么变量,只直传递主窗口的window对象

在showModalDialog(或showModelessDialog)读取和设置时:

alert(window.dialogArguments.var_name)//读取var_name变量

window.dialogArguments.var_name="oyiboy"//设置var_name变量

同时我也可以操作var_id变量

alert(window.dialogArguments.var_id)//读取var_id变量

window.dialogArguments.var_id="001"//设置var_id变量

同样还可以对主窗口的任何对象进行操作,如form对象里的元素。

window.dialogArguments.form1.index1.value="这是在设置index1元素的值"

六、多个showModelessDialog的相互操作。

因为光说很费劲,我就偷点懒,直接用代码来说了,如果不明白的话那就直接来信(oyiboy#163.net(

使用时请将#改成@))问我吧。

以下代码的主要作用是在一个showModelessDialog里移动别一个showModelessDialog的位置。

主文件的部份js代码。

var s1=showModelessDialog(''控制.htm'',window,"dialogTop:1px;dialogLeft:1px")//打开控

制窗口

var s2=showModelessDialog(''about:blank'',window,"dialogTop:200px;dialogLeft:300px")

//打开被控制窗口

控制.htm的部份代码。

<script>

//操作位置数据,因为窗口的位置数据是"xxxpx"方式的,所以需要这样的一个特殊操作函数。

function countNumber(A_strNumber,A_strWhatdo)

{

A_strNumber=A_strNumber.replace(''px'','''')

A_strNumber-=0

switch(A_strWhatdo)

{

case"-":A_strNumber-=10;break;

case"+":A_strNumber+=10;break;

}

return A_strNumber+"px"

}

</script>

<input type="button" onclick="window.dialogArguments.s2.dialogTop=countNumber

(window.dialogArguments.s2.dialogTop,''-'')" value="上移">

<input type="button" onclick="window.dialogArguments.s2.dialogLeft=countNumber

(window.dialogArguments.s2.dialogLeft,''-'')" value="左移">

<input type="button" onclick="window.dialogArguments.s2.dialogLeft=countNumber

(window.dialogArguments.s2.dialogLeft,''+'')" value="右移">

<input type="button" onclick="window.dialogArguments.s2.dialogTop=countNumber

(window.dialogArguments.s2.dialogTop,''+'')" value="下移">

以上关键部份是:

窗口命名方式:var s1=showModelessDialog(''控

制.htm'',window,"dialogTop:1px;dialogLeft:1px")

变量访问方式:window.dialogArguments.s2.dialogTop

这个例子只是现实showModelessDialog与showModelessDialog之间的位置操作功能,通过这个原理,

在showModelessDialog之间相互控制各自的显示页面,传递变量和数据等。这要看各位的发挥了。

如果打开了一个模式窗口,想在打开的窗口中,关闭本窗口,重新加载父窗口,代码如下:

Response.Write("<script

language=javascript>parent.window.opener=null;parent.window.dialogArguments.location.reload

();window.close();</script>");

或者

function doModal(url){

win=window.showModalDialog

(url,0,"dialogWidth:500px;dialogHeight:500px;status:no;help:no;");

document.location.reload();//js页面中加入这句话就行了

}

window.opener 的用法

window.open()支持环境: JavaScript1.0+/JScript1.0+/Nav2+/IE3+/Opera3+

基本语法:

window.open(pageURL,name,parameters)

其中:

pageURL为子窗口路径

name为子窗口句柄

parameters为窗口参数(各参数用逗号分隔)

示例:

<SCRIPT>

<!--

window.open('page.html','newwindow','height=100,width=400,top=0,left=0,toolbar=no,menubar=no,scrollbars=no, resizable=no,location=no, status=no')

//写成一行

-->

</SCRIPT>

脚本运行后,page.html将在新窗体newwindow中打开,宽为100,高为400,距屏顶0象素,屏左0象素,无工具条,无菜单条,无滚动条,不可调整大小,无地址栏,无状态栏。

上例中涉及的为常用的几个参数,除此以外还有很多其他参数,如下所示:

各项参数

其中yes/no也可使用1/0;pixel value为具体的数值,单位象素。

参数|取值范围|说明

alwaysLowered| yes/no|指定窗口隐藏在所有窗口之后

alwaysRaised| yes/no|指定窗口悬浮在所有窗口之上

depended| yes/no|是否和父窗口同时关闭

directories| yes/no| Nav2和3的目录栏是否可见

height| pixel value|窗口高度

hotkeys| yes/no|在没菜单栏的窗口中设安全退出热键

innerHeight| pixel value|窗口中文档的像素高度

innerWidth| pixel value|窗口中文档的像素宽度

location| yes/no|位置栏是否可见

menubar| yes/no|菜单栏是否可见

outerHeight| pixel value|设定窗口(包括装饰边框)的像素高度

outerWidth| pixel value|设定窗口(包括装饰边框)的像素宽度

resizable| yes/no|窗口大小是否可调整

screenX| pixel value|窗口距屏幕左边界的像素长度

screenY| pixel value|窗口距屏幕上边界的像素长度

scrollbars| yes/no|窗口是否可有滚动栏

titlebar| yes/no|窗口题目栏是否可见

toolbar| yes/no|窗口工具栏是否可见

Width| pixel value|窗口的像素宽度

z-look| yes/no|窗口被激活后是否浮在其它窗口之上

用函数控制弹出窗口

下面是一个完整的代码。

<html>

<head>

<script LANGUAGE="JavaScript">

function openwin(){

window.open("page.html","newwindow","height=100, width=400, toolbar=no, menubar=no, scrollbars=no, resizable=no, location=no, status=no")//写成一行

}

</script>

</head>

<body onload="openwin()">

任意的页面内容...

</body>

</html>

这里定义了一个函数openwin(),函数内容就是打开一个窗口。怎么调用呢?

方法一:

<body onload="openwin()">

浏览器读页面时弹出窗口;

方法二:

<body onunload="openwin()">

浏览器离开页面时弹出窗口;

方法三:

用一个连接调用:

<a rel="external nofollow" href="#" onclick="openwin()">打开一个窗口</a>

注意:使用的“#”是虚连接。

方法四:

用一个按钮调用:

<input type="button" onclick="openwin()" value="打开窗口">

如何实现在不使用window.showModalDialog的情况下用 window.open方式向父窗口返回值。

例如:页面AAA.htm用 window.open方式弹出页面 BBB.htm。

在页面BBB.htm上选择一个值,确定关闭窗口后将选择的这个值返回到父窗口AAA.htm。

AAA.htm得到返回的值后,给本页面上的文本框赋值。

BBB.htm页面中加入下面代码:

window.opener.document.getElementById("theTextAreaId").value= document.getElemnetById("theSelectId").value;

window.opener的用法

window.opener返回的是创建当前窗口的那个父窗口的引用,比如点击了a.htm上的一个链接而打开了b.htm,然后我们打算在b.htm上输入一个值然后赋予a.htm上的一个id为“name”的textbox中,就可以写为:

window.opener.document.getElementById("name").value="输入的数据";

对于javascript中的window.opener没有很好的理解。

为什么框架中不能使用,弹出窗口的父窗口不能在框架里面的某个页面呢?那怎样通过弹出窗口操作框架中的父窗口呢?

opener.parent.frames['frameName'].document.all.input1.value

即opener这个对象为前一个窗口,可以使用window.opener.document...调用document的相关方法,例如下面的例子,插入一些table行到前一个窗口:

function taletoTb(itemStr){

newRow= opener.document.all.itemTb.insertRow(opener.document.all.itemTb.rows.length);

rowCnt= opener.document.all.itemTb.rows.length;

newCell= newRow.insertCell();

newCell.insertAdjacentHTML('BeforeEnd','<div align="center">'+itemCode+'</div>');

newCell= newRow.insertCell();

newCell.insertAdjacentHTML('BeforeEnd','<div align="center">'+itemName+'</div>');

newCell= newRow.insertCell();

newCell.insertAdjacentHTML('BeforeEnd','<div align="center"><img src="../../../images/delete2.gif" width="12" height="12" onClick="userRightDel(this);"><input type="hidden" name="itembox" value='+itemCode+'></div>');

} 11:56浏览(159)评论(0)分类: JavaScript 2008-02-27

缩略显示confirm用法和例子

一般用于弹出对话框(确定/否)

确定:就执行其嵌套的内容;否:则反之

<script language="javascript">

//验证时间格式 YYYY-MM-DD/YYYY,MM,DD

function isDate(date){

var regu="^[0-9]{4}-([0-1]?)[0-9]{1}-([0-3]?)[0-9]{1}$";

var re= new RegExp(regu);

if(date.search(re)!=-1)

return true;

else

return false;

}

function sureButton(){

if(!confirm('真的要删除吗?删除后将无法恢复!')){

return;

}

//验证时间格式 YYYY-MM-DD

var startDate=document.getElementById("startDate").value;

var endDate=document.getElementById("endDate").value;

if(!isDate(startDate)){

alert(startDate+"请输入正确的开始日期格式!如:(YYYY-MM-DD)2008-01-01");

return document.getElementById("startDate").focus();

}

if(!isDate(endDate)){

alert("请输入正确的结束日期格式!如:(YYYY-MM-DD)2008-01-01");

return document.getElementById("endDate").focus();

}

if(startDate==""){

alert("请输入开始日期");

return document.getElementById("startDate").focus();

}

if(endDate==""){

alert("请输入结束日期");

return document.getElementById("endDate").focus();

}

startDate=startDate.replace(new RegExp('-','g'),'/');

alert(startDate);

endDate=endDate.replace(new RegExp('-','g'),'/');

var startTime=new Date(startDate).getTime();

alert(new Date(startDate).getTime());

var endTime=new Date(endDate).getTime();

if((endTime-startTime)<0){

alert("结束日期必须大于开始日期");

return document.getElementById("endDate").focus();

}

}

</script>

<html>

<head>

<meta http-equiv="Content-Language" content="zh-cn">

<meta name="generator" content="Bluefish 1.0.7">

<meta name="ProgId" content="FrontPage.Editor.Document">

<meta http-equiv="Content-Type" content="text/html; charset=gb2312">

<title></title>

<style type="text/css">

table{color:#000000; font-family:宋体; font-size: 12px; height:12}

t1{color:#008000;align:center}

</style>

</head>

<body topmargin="0" leftmargin="0">

<div align="left">

<table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="461" height="8" id="AutoNumber1" background="images/kabg.gif">

<tr>

<td colspan="3">

<table cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="100%" height="17">

<tr>

<td width="19%" height="25" align="center" style="border:1px solid#000080;"><font color="#008000">开始日期</font></td>

<td width="31%" style="border:1px solid#000080;">

<input name="startDate" type="text" id="startDate" size="15"></td>

<td width="22%" align="center" style="border:1px solid#000080;"><font color="#008000">结束日期</font></td>

<td width="28%" style="border:1px solid#000080;">

<input name="endDate" type="text" id="endDate" size="15"></td>

</tr>

</table>

</td>

</tr>

<tr>

<td height="28" align="center" style="border:1px solid#000080;" colspan="3">

<table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="100%" id="AutoNumber3" height="17">

<tr>

<td width="14%" align="center" height="25">

<font color="#008000">当前状态</font></td>

<td width="18%" align="center" height="25">

<select size="1" name="display">

<option value="0">无效</option>

<option value="1">等待</option>

<option value="2" selected>显示中</option>

</select></td>

<td width="15%" align="center" height="25" style="border-left: 1px solid#000080; border-right-width: 1; border-top-width: 1; border-bottom-width: 1">

<font color="#008000">Logo行宽</font></td>

<td width="10%" align="center" height="25">

<select size="1" name="colValue">

<option>1</option>

<option>2</option>

<option>3</option>

<option>4</option>

<option>5</option>

<option>6</option>

</select></td>

<td width="12%" align="center" style="border-left: 1px solid#000080; border-right-width: 1; border-top-width: 1; border-bottom-width: 1"><font color="#008000">显示顺序</font></td>

<td width="5%">

<input name="displayOrder" type="text" id="displayOrder" size="3" value="1">

</td>

<td width="43%" align="center" height="25" style="border-left-style: solid; border-left-width: 1; border-right-width: 1; border-top-width: 1; border-bottom-width: 1">

<input onclick="cancelButton()" type="reset" value="关闭" name="B2" style="border-style: outset; border-width: 1; color:#0000FF">

<input onclick="sureButton()" type="submit" value="确定" name="B1" style="border-style: outset; border-width: 1; color:#0000FF"></td>

</tr>

</table>

</td>

</tr>

<tr>

<td height="20" colspan="3" align="center" style="border:1px solid#000080;">

<marquee behavior="slide" style="color:#808080">::日期格式为年-月-日,直接填入图片和点击路径全名时应仔细查对是否正确::</marquee></td>

</tr>

</table>

</div>

</body>

</html>

可以批量删除表格记录行,通过checkbox选择删除的行;可以批量增加记录行,通过输入框指定行数。

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=shift-js">

<title>The page of append rows to Table</title>

<script language="JavaScript">

//新增行

function addRow(){

var textNum= document.getElementById("rownum");

//得到新增行记录的行数

var index= textNum.value;

if(!checknum(index)){

alert("You can only input number in the TEXT!");

textNum.focus();

textNum.select();

}

for(var i= 0; i< index; i++){

//得到表格对象

var tableObj= document.getElementById("mainTb");

//得到tbody对象

var tableBodyObj= document.getElementById("mainBody");

var newRowObj= document.createElement("tr");

var newCheckBox= document.createElement("td");

var newtext1= document.createElement("td");

var newtext2= document.createElement("td");

var newtext3= document.createElement("td");

newCheckBox.innerHTML='<center><input type="Checkbox" name="checkbox" onclick="checkBoxSel()"></center>';

newtext1.innerHTML='<input type="text" name="newCarName" size="9">';

newtext2.innerHTML='<input type="text" name="newCarName" size="9">';

newtext3.innerHTML='<input type="text" name="newCarName" size="9">';

//新增的tr节点下增加td节点

newRowObj.appendChild(newCheckBox);

newRowObj.appendChild(newtext1);

newRowObj.appendChild(newtext2);

newRowObj.appendChild(newtext3);

// tbody节点下增加tr节点

tableBodyObj.appendChild(newRowObj);

}

}

//新增行数选择框检查输入必须是数字

function checknum(strVal){

if(strVal.length!= 0){

var r= strVal.match(new RegExp(/^[0-9]+$/));

if(r== null){

return false;

}else{

return true;

}

}

return true;

}

//批量删除指定的行

function deleteRow(){

var Tblen;

//得到所有 checkbox对象

var checkbox= document.getElementsByName("checkbox");

//var checkboxlen= document.all.checkbox.length;

//得到所有提交的checkbox个数

var checkboxlen= checkbox.length;

var ischecked;

//得到删除按钮对象

var delbutton= document.getElementById("delete");

for(var i=0; i< checkboxlen; i++){

//得到表格行数

Tblen= this.mainTb.rows.length;

//最终保留一行记录

if(Tblen== 1)

{

document.getElementsByName("checkbox")[0].checked= false;

alert("A line have to be saved in the ID of mainTb!");

//删除按钮不可用

delbutton.disabled= true;

return false;

}

ischecked= checkbox[i].checked;

//如果当前的checkbox选中:删除当前节点,由于删除节点后,下面的节点上移,游标(记录行指针)也应该上移

if(ischecked)

{

// document.all("mainTb").deleteRow(i);

document.getElementById("mainTb").deleteRow(i);

//游标(记录行指针)上移

i--;

}

//重新统计checkbox个数

checkboxlen= checkbox.length;

}

//删除操作后按钮状态是不可用

delbutton.disabled= true;

}

// checkbox按钮单击事件处理函数:是否至少选中一行记录,是可以删除操作;如果没有选择,删除按钮不可用

function checkBoxSel(){

//得到删除按钮对象

var delbutton= document.getElementById("delete");

if(checkselect()){

delbutton.disabled= false;

}else{

delbutton.disabled= true;

}

}

function checkselect(){

//得到所有 checkbox对象

var checkbox= document.getElementsByName("checkbox");

//得到所有提交的checkbox个数

var chklength= checkbox.length;

var flag= false;

for(var i= 0; i< chklength; i++)

{

if(checkbox[i].checked== true)

{

flag= true;

break;

}

}

if(flag== true)

{

return true;

} else{

return false;

}

}

//页面加载body内容时执行

function loadpage(){

var delbutton= document.getElementById("delete");

var rownum= document.getElementById("rownum");

//初始“删除”按钮不可用

delbutton.disabled= true;

//初始行数输入框内容为空

rownum.value="";

}

</script>

动态添加、删除行,分别通过insertRow,deleteRow方法实现,显示行号,通过rowIndex属性获得,基本可以动态实现相关功能。

<Script Language="Javascript">

var cGetRow=-99999;

var lineNo= 1;

function _(id){

return document.getElementById(id);

}

// The index of the row to be deleted.

// This index starts from 0 and is relative to the logical order(not document order)

// of all the rows contained inside the table.

// If the index is-1 the last row in the table is deleted.

function AddRow(){

//添加一行

var newTr= _("tab1").insertRow();

//添加两列

var newTd0= newTr.insertCell();

var newTd1= newTr.insertCell();

//设置列内容和属性

newTd0.innerHTML='<input type=checkbox id="box'+ lineNo+'" onClick="GetRow()">';

//测试动态改变innerHTML中的checkbox的id

alert(_("box"+ lineNo).id);

newTd1.innerText='新增加行'+ lineNo;

lineNo++;

}

function DelRow(iIndex){

//删除一行

if(iIndex==-99999){

alert("系统提示:没有选中行号!");

}else{

iIndex= cGetRow;

_("tab1").deleteRow(iIndex);

}

}

function GetRow(){

//获得行索引

//两个parentElement分别是TD和TR哟,rowIndex是TR的属性

//this.parentElement.parentElement.rowIndex

cGetRow=window.event.srcElement.parentElement.parentElement.rowIndex;

}

function ShowRow(){

//显示行号

alert(cGetRow);

//alert(document.getElementsByTagName("tr").length);

}

</script>

<table id="tab1" border=1>

<tr id="tr1">

<td width=6%><input type=checkbox id="box1" onClick="GetRow()"></td>

<td id="a">第一行</td>

</tr>

<tr id="tr2">

<td width=6%><input type=checkbox id="box2" onClick="GetRow()"></td>

<td id="b">第二行</td>

</tr>

<tr id="tr3">

<td width=6%><input type=checkbox id="box3" onClick="GetRow()"></td>

<td id="c">第三行</td>

</tr>

</table>

<table id="tab1" border=1>

<tr id="tr1">

<td width=6%><input type=checkbox id="box1" onClick="GetRow()"></td>

<td id="a">统计</td>

</tr>

</table>

<input type="submit" name="Submit" value="AddRow" onclick="javascript:AddRow();">

<input type="submit" name="Submit" value="DelRow" onclick="javascript:DelRow(cGetRow);">

<input type="submit" name="Submit" value="ShowRow" onclick="javascript:ShowRow();">表格动态增加行

感谢您花时间阅读本文!我们希望通过对dialogarguments和如何关闭showModalDialog窗口的问题进行探讨,为您提供了一些有用的见解和解决方案。如果您需要更多帮助或者有其他疑问,请不要犹豫与我们联系。

javascript权威指南,JavaScript权威指南和JavaScript高级程序设计哪本好南宁app开发(南宁APP开发的公司有哪些)