当前位置: 首页 > 编程日记 > 正文

弹出窗口(对话框)

对话框分为三种:

window.open方法

无模式对话框

有模式对话框  
 
第一:OPEN方法

None.gif<script>
None.gif
function open_cate()
ExpandedBlockStart.gifContractedBlock.gif
{
InBlock.gif    window.open(
"OpenUp.aspx","","toolbar=0,location=0,directories=0,status=0,
InBlock.gif                menubar=0,scrollbars=1,resizable=0,left=200,top=100,width=250,height=400
");
InBlock.gif
ExpandedBlockEnd.gif}

None.gif
</script>
这种方法打开浏览器的一个新实例,通常加载某个特定 URL 指定的文档。定位已经打开的窗口的特定的已命名实例是可能的,这样您就可以避免打开新的窗口,而是使用您以前打开的现有窗口用于另一个目的。详细信息,请参见 Web Workshop 中的 open(英文)方法。通过打开浏览器的另外一个实例,用户可以在打开的窗口中自由地进行切换。您可以使用 window.open 的一个情况就是一个电子邮件应用程序,它允许用户在一个另外的窗口中打开一条电子邮件消息,同时又保持与原窗口中的消息列表的完全交互操作。

父窗口向弹出窗口传递信息
window.open的第一个参数为URL,我们可以把参数加在URL后,例如'OpenUp.aspx?parm1=abc&parm2=<%=serversideparm%>'。这样,只需在弹出窗口QueryString到这些参数,就实现了动态向弹出窗口传递信息。
将弹出窗口的信息传回父窗口
使用弹出传口的目的主要是为了同用户的交互,所以如何在父页面中得到用户对弹出窗口的操作结果是非常重要的。其实这里实现的方法也很简单,同样是通过JavaScript:通过window.opener得到父窗口的window对象,就可以对父窗口进行操作,比如对某个TextBox设值。
心得:

当初为了实现这个简单的交互操作,花费了整整一下午的时间,关键是对JavaScript太生疏,自以为做Server端的东西才是本事,其实是犯了大错。

另外,如果在Js中引用.net Server端对象遇到对象为空的报错时,很有可能是对象在编译后,VS对控件进行了重命名。一开始这里不知道,害得我好苦


第二:无模式对话框:无模式对话框允许用户在对话框打开的同时与原窗口进行交互操作。在这种情况中,对话框保持在浏览器的上面并处于禁用状态。如果用户从原始文档中移开进行其它浏览,则无模式对话框将被自动关闭,因为该对话框的所有上下文已经丧失。高级搜索功能可以很好地使用这样的对话框,以便使用户可以选择文档中找到的文本,同时使对话框保持打开的状态,这样用户就可以迅速地前进到已找到文本的下一个实例。
第三:有模式对话框:有模式对话框常使程序可以使用户完全集中于某一特定的对话框,并要求在继续进行之前与其进行交互操作。这种情况的一个示例就是数据输入操作,在该操作中,必须输入某些数据后应用程序才能继续。
None.gif<HTML>
None.gif
<BODY>
None.gifThis page will invoke my DHTML dialog box when the button is clicked.
None.gif
<BR>
None.gif
<input type='button' onclick="showModalDialog('dcontent1.htm');" value="Create Dialog">
None.gif
</BODY>
None.gif
</HTML>
None.gif<!--dcontent1.htm:-->
None.gif
None.gif
<HTML>
None.gif
<BODY style="background-color:lightblue;margin:10;">
None.gifThis is some content for my DHTML dialog box.
None.gif
<BR>
None.gif
<BR>
None.gif
<input type='button' onclick="window.close();" value=" OK ">
None.gif
</BODY>
None.gif
</HTML>
None.gif
None.gif

dialog1.htm 文件在单击按钮时执行 showModalDialog 方法,并将第二个文件 dcontent1.htm 用作对话框的内容。dcontent1.htm 文件具有一些 HTML 内容和一个 OK 按钮,单击该按钮时会将对话框关闭。注意对话框是如何带着一个状态条出现的。它可以通过对函数的可选 sFeatures 参数的值进行操作而去除。尝试改变一下各参数的值,这可以显示对话框的不同样式。例如,您可以更改 dialog1.htm 中的方法调用去除状态条并调整对话框的大小。

showModalDialog('dcontent1.htm','','status:no;resizable:yes');

现在,将方法由 showModalDialog 改为 showModelessDialog,并查看无模式对话框怎样允许用户与对话框下面的文档进行交互操作。您可以在 Web Workshop 的 DHTML 参考(英文)一节中查看关于所有对话框设置的完整说明。

None.gif<!--dialog2.htm-->
None.gif
None.gif
<HTML>
None.gif
<HEAD>
None.gif
</HEAD>
ExpandedBlockStart.gifContractedBlock.gif
<SCRIPT>dot.gif
InBlock.gif
function doDialog()
ExpandedSubBlockStart.gifContractedSubBlock.gif
dot.gif{
InBlock.gif  
var x=showModalDialog('dcontent2.htm',ip1.value,'status:no;resizable:yes');
InBlock.gif  d1.innerHTML
="The dialog box return value was: " + x;
ExpandedBlockEnd.gif}

None.gif
</SCRIPT>
None.gif
<BODY>
None.gifThis page will invoke my DHTML dialog box when the button is clicked.
None.gif
<BR><BR>
None.gif
<INPUT type=text id=ip1 value='input content'>
None.gif
<BR><BR>
None.gif
<input type='button' onclick="doDialog()" value="Create Dialog">
None.gif
<BR><BR>
None.gif
<DIV id=d1></DIV>
None.gif
</BODY>
None.gif
</HTML>
None.gif
None.gif
<!--dcontent2.htm-->
None.gif
None.gif
<HTML>
None.gif
<BODY style="background-color:lightblue;margin:10;"   onload="d1.innerHTML=dialogArguments;">
None.gifThis is some content for my DHTML dialog box.
None.gif
<BR><BR>
None.gif
<DIV id=d1></DIV>
None.gif
<BR><BR>
None.gif
<input type='button' onclick="returnValue=true;window.close();" value=" OK "> &nbsp&nbsp&nbsp
None.gif
<input type='button' onclick="returnValue=false;window.close();" value=" Cancel ">
None.gif
</BODY>
None.gif
</HTML>
None.gif
None.gif

dialog2.htm 文件调用 DHTML 对话框,后者将 dcontent2.htm 文件用作其内容。输入元素的值被传递到对话框中,对话框使用该值显示内容。返回值根据用户对 OKCancel 的选择进行设置。

在无模式对话框的情形中,返回值则有所不同。对话框将被显示,但调用 showModelessDialog 的代码将继续运行。对于无模式对话框,来自 showModelessDialog 的返回值为 DHTML 对话框中包含的文档的 window 对象,它可以随后用于与打开的对话框进行通信。我们来看一下下面的无模式对话框的示例。在该示例中,在主页面设置一个值可以影响到打开的对话框,并且在对话框中设置一个值也可以影响到主页面。

None.gif<!--dialog3.htm-->
None.gif
None.gif
<HTML>
None.gif
<HEAD>
None.gif
</HEAD>
ExpandedBlockStart.gifContractedBlock.gif
<SCRIPT>dot.gif
InBlock.gif
var dWin=null;
InBlock.gif
function doDialog()
ExpandedSubBlockStart.gifContractedSubBlock.gif
dot.gif{
InBlock.gifdWin
=showModelessDialog('dcontent3.htm',window,'status:no;resizable:yes');
ExpandedSubBlockEnd.gif}

InBlock.gif
InBlock.gif
function setDialogValue()
ExpandedSubBlockStart.gifContractedSubBlock.gif
dot.gif{
InBlock.gif  
if (dWin != null)
ExpandedSubBlockStart.gifContractedSubBlock.gif  
dot.gif{
InBlock.gif   dWin.d1.innerHTML
=ip1.value;
ExpandedSubBlockEnd.gif  }

ExpandedBlockEnd.gif}

None.gif
</SCRIPT>
None.gif
<BODY>
None.gifThis page will invoke my DHTML dialog box when the button is clicked.
None.gif
<BR><BR>
None.gif
<INPUT type=text id=ip1 value='input content'>
None.gif
<BR><BR>
None.gif
<input type='button' onclick="setDialogValue();" value="Set Dialog Value">
None.gif
<BR><BR>
None.gif
<input type='button' onclick="doDialog();" value="Create Dialog">
None.gif
<BR><BR>
None.gif
<DIV id=d1></DIV>
None.gif
</BODY>
None.gif
</HTML>
None.gif
None.gif
<!--dcontent3.htm-->
None.gif
None.gif
<HTML>
ExpandedBlockStart.gifContractedBlock.gif
<SCRIPT>dot.gif
InBlock.gif
function window.onunload()
ExpandedSubBlockStart.gifContractedSubBlock.gif
dot.gif{
InBlock.gif  dialogArguments.dWin
=null;
ExpandedBlockEnd.gif}

None.gif
</SCRIPT>
None.gif
None.gif
<BODY style="background-color:lightblue;margin:10;">
None.gifThis is some content for my DHTML dialog box.
None.gif
<BR><BR>
None.gif
<DIV id=d1></DIV>
None.gif
<BR><BR>
None.gif
<input type='text' id=ip1 onclick='dialogArguments.d1.innerHTML=ip1.value;'>
None.gif
<BR><BR>
None.gif
<input type='button' onclick="dialogArguments.d1.innerHTML=ip1.value;" value=" Apply "> &nbsp&nbsp&nbsp
None.gif
<input type='button' onclick="dialogArguments.d1.innerHTML=ip1.value;window.close();" value=" OK ">
None.gif
&nbsp&nbsp&nbsp
None.gif
<input type='button' onclick="window.close();" value=" Cancel ">
None.gif
None.gif
</BODY>
None.gif
</HTML>
None.gif
None.gif

None.gif<SCRIPT>
ExpandedBlockStart.gifContractedBlock.gif
function fnRandom(iModifier)dot.gif{
InBlock.gif    
return parseInt(Math.random()*iModifier);
ExpandedBlockEnd.gif}

ExpandedBlockStart.gifContractedBlock.gif
function fnSetValues()dot.gif{
InBlock.gif    
var iHeight=oForm.oHeight.options[oForm.oHeight.selectedIndex].text;
ExpandedSubBlockStart.gifContractedSubBlock.gif    
if(iHeight.indexOf("Random")>-1)dot.gif{
InBlock.gif        iHeight
=fnRandom(document.body.clientHeight);
ExpandedSubBlockEnd.gif    }

InBlock.gif    
var iWidth=oForm.oWidth.options[oForm.oWidth.selectedIndex].text;
ExpandedSubBlockStart.gifContractedSubBlock.gif    
if(iWidth.indexOf("Random")>-1)dot.gif{
InBlock.gif        iWidth
=fnRandom(document.body.clientWidth);
ExpandedSubBlockEnd.gif    }

InBlock.gif    
var iTop=oForm.oTop.options[oForm.oTop.selectedIndex].text;
ExpandedSubBlockStart.gifContractedSubBlock.gif    
if(iTop.indexOf("Random")>-1)dot.gif{
InBlock.gif        iTop
=fnRandom(screen.height);
ExpandedSubBlockEnd.gif    }

InBlock.gif    
var iLeft=oForm.oLeft.options[oForm.oLeft.selectedIndex].text;
ExpandedSubBlockStart.gifContractedSubBlock.gif    
if(iLeft.indexOf("Random")>-1)dot.gif{
InBlock.gif        iLeft
=fnRandom(screen.width);
ExpandedSubBlockEnd.gif    }

InBlock.gif    
var sEdge=oForm.oEdge.options[oForm.oEdge.selectedIndex].text;
InBlock.gif    
var bCenter=oForm.oCenter.options[oForm.oCenter.selectedIndex].text;
InBlock.gif    
var bHelp=oForm.oHelp.options[oForm.oHelp.selectedIndex].text;
InBlock.gif    
var bResize=oForm.oResize.options[oForm.oResize.selectedIndex].text;
InBlock.gif    
var bStatus=oForm.oStatus.options[oForm.oStatus.selectedIndex].text;
InBlock.gif    
InBlock.gif    
var sFeatures="dialogHeight: " + iHeight + "px; dialogWidth: " + iWidth + "px; dialogTop: " + iTop + "px; dialogLeft: " + iLeft + "px; edge: " + sEdge + "; center: " + bCenter + "; help: " + bHelp + "; resizable: " + bResize + "; status: " + bStatus + ";";
InBlock.gif    
InBlock.gif    
return sFeatures;
ExpandedBlockEnd.gif}

ExpandedBlockStart.gifContractedBlock.gif
function fnOpen()dot.gif{
ExpandedSubBlockStart.gifContractedSubBlock.gif
/**//* The  method constructor looks like:
InBlock.gif    showModalDialog(
InBlock.gif        sURL="The page that is opened"
InBlock.gif        sArguments="Extra values or object references"
InBlock.gif        sFeatures="features of the window";
InBlock.gif    
InBlock.gif    )
ExpandedSubBlockEnd.gif
*/

InBlock.gif    
var sFeatures=fnSetValues();
InBlock.gif    oFeatures.innerHTML
='window.showModalDialog("SMD_target.htm","' + oForm.oArguments.value + '","' + sFeatures + '");';
InBlock.gif    window.showModalDialog(
"SMD_target.htm", oForm.oArguments.value, sFeatures)
ExpandedBlockEnd.gif}

None.gif
</SCRIPT>


转载于:https://www.cnblogs.com/mjgforever/archive/2006/03/07/344760.html

相关文章:

隐藏系统保留区

为了下午的装机活动自己就安了一个老毛桃&#xff0c;制作启动盘完毕后发现电脑中的“系统保留”盘出来了&#xff0c;为什么会出现这个盘呢&#xff1f; 当笔记本安装Windows7系统时会自己主动产生一个几百兆的系统保留分区。里面保存着系统/磁盘引导的数据。有些笔记本在出厂…

StaticFactoryMethod_Level2

以下代码是“简单工厂模式”的第二个例子&#xff1a;

06- web兼容性测试

稍后更新。。转载于:https://www.cnblogs.com/Chamberlain/p/11064664.html

話說我們家姚明

已經讀三年級了,成績不錯,有目共睹!最近三場比賽連續三次得分在30分以上...呵呵~在NBA那個高手如雲的地方如此出色! ^_^#好強~ 真的好強!!麥迪那個軟蛋,干脆把他賣掉得了!拿高工資不做事的人.. 凸-_-转载于:https://www.cnblogs.com/tohen/archive/2006/03/09/346286.html

20145240《网络对抗》MSF基础应用

MSF基础应用 一个主动攻击&#xff0c;如ms08_067 启动msfsearch ms08_067&#xff0c;查找相应的漏洞&#xff0c;查询可攻击的模块。根据上述漏洞的模块use exploit/windows/smb/ms08_067_netapi选择该模块接下来查看相应的攻击载荷&#xff0c;首先我们可以查看可使用的载荷…

StaticFactoryMethod_Level3

以下代码是“简单工厂模式”的第三个例子&#xff1a;

Dynamics CRM 导入用户数据错误 could not retrieve salesperson role

在CRM中通过导入数据的方式创建用户时报下图中的错误&#xff0c;“could not retrieve saleperson role”。原因是系统中的自带的salesperson安全角色被删除了&#xff0c;在用导入数据的方式导入文档新建用户时是没有安全角色让你选择的&#xff0c;系统默认给分派了销售员的…

也许这样叫做成熟

早上想坐早班车来接三日游回来的佳&#xff0c;不料还是比旅游团的车晚一步&#xff0c;不过今天到……小结&#xff1a;1、做事&#xff0c;大事不糊涂&#xff0c;小事灵活受理&#xff1b;2、目标明确&#xff0c;善始善终&#xff1b;3、卧薪尝胆&#xff0c;体味时间的诅咒…

写文章 TEE技术分析【转】

转自&#xff1a;https://zhuanlan.zhihu.com/p/24222064 首先介绍一下TEE的主要关键技术&#xff1a; 1&#xff0e;安全启动&#xff08;Secure Boot&#xff09; 安全启动技术可以用于需要防止篡改系统镜像&#xff0c;比如安全系统&#xff0c;安全手机镜像等。 2&#xff…

StaticFactoryMethod_Level4

以下代码是“简单工厂模式”的第四个例子&#xff1a;

jquery 获取Select option 选择的Text和Value

jquery radio取值,checkbox取值,select取值,radio选中,checkbox选中,select选中,及其相关设置 获取一组radio被选中项的值:var item $(input[nameitems][checked]).val();获取select被选中项的文本:var item $("select[nameitems] option[selected]").text(); 获取…

Android -- Annotation(注解)原理详解及常见框架应用

1&#xff0c;我们在上一篇讲到了EventBus源码及3.0版本的简单使用&#xff0c;知道了我们3.0版本是使用注解方式标记事件响应方法的&#xff0c;这里我们就有一个疑问了&#xff0c;为什么在一个方法加上类似于“Subscribe”&#xff0c;就可以让我们的反射找到我们的事件响应…

简单工厂模式(StaticFactoryMethod)

来华北电力大学数理系LSGO软件技术团队学习Coding&#xff0c;我通常第一个就讲“简单工厂模式”&#xff0c;这一讲不仅仅是讲模式&#xff0c;更主要的是让大家体会什么是软件系统的“可复用”、“可扩展”、“易维护”、“灵活性好”&#xff0c;以及如何通过面向对象程序设…

Html,Css,Javascript是什么?

本文属于基础科普文&#xff0c;高富帅们请绕道吧。 Html&#xff0c;css&#xff0c;javascript是做网页前台设计的标准套装&#xff0c;html是一些网页控件&#xff0c;css是美化这些控件的代码&#xff08;层叠样式表&#xff09;&#xff0c;js&#xff08;javascript&…

[转帖]ERP术语

栖息谷-IT管理-[转帖]ERP术语 [转帖]ERP术语 1 英文缩写&#xff1a; MIS 英文全称&#xff1a; Management Information System 中文翻译&#xff1a; 管理信息系统 简释&#xff1a; MIS是指对企业大量的原始管理…

how tomcat works 总结 二

第五章 servlet容器 第 5 章讨论 container 模块。container 指的是 org.apache.catalina.Container 接口&#xff0c;有4 种类型的 container:engine, host, context 和 wrapper。这章提供了两个工作于 context 和wrapper 的程序。容器共分四类,类图例如以下:一个wrapper就是一…

策略模式(Strategy)

这是来数理系LSGO软件技术团队学习Coding&#xff0c;第二个要学习的设计模式。该模式在解决同一个问题时可以使用不同的算法。以满足“开闭原则”&#xff0c;把各种算法与实际业务逻辑解耦合&#xff0c;以便写出良好的代码。

[scrum]2011/9/22-----第二天

scrum 总结&#xff1a; Team member Yesterday’s Work Today’s Work Issue R X Task196:Completed xml 文件的解析&#xff0c;并且通过了两个测试用例 Task198:Completed 添加全局变量&#xff1a;当前会议和remind list Task201&#xff1a;Active 基本完成了select …

千千静听4.6.7版发布了

现在这个版本算是很不错的了&#xff0c;提供了相当完善的播放功能 下载&#xff1a; http://ttplayer.com/ttpsetup.exe 转载于:https://www.cnblogs.com/it201108/archive/2006/04/29/2148385.html

Strategy_Requirement1

以下代码是“策略模式”的第一个例子&#xff1a;

代码解说Android Scroller、VelocityTracker

在编写自己定义滑动控件时经常会用到Android触摸机制和Scroller及VelocityTracker。Android Touch系统简单介绍&#xff08;二&#xff09;:实例具体解释onInterceptTouchEvent与onTouchEvent的调用过程对Android触摸机制须要用到的函数进行了具体的解释。本文主要介绍两个重要…

写给云栖社区在做网站的朋友一点干货

我本人也是从事网站建设及APP开发业务的&#xff0c;工作多年下来&#xff0c;从以前的几百元企业网站&#xff0c;到商城网站&#xff0c;以及一些应用类型的APP开发&#xff0c;亲眼目睹了很多企业&#xff0c;以及很多项目&#xff0c;在应用的过程中&#xff0c;过了1-2年&…

Strategy_Requirement2

以下代码是“策略模式”的第二个例子&#xff1a;

如何启用SQL Server 2008的FILESTREAM特性

如何启用SQL Server 2008的FILESTREAM特性 今天安装SQL Server 2008的时候没有注意&#xff0c;忘记了启用FILESTREAM特性&#xff0c;因为默认情况下FILESTREAM是禁用的。安装完成后&#xff0c;再导入一个.bak的备份数据库时提示FILESTREAM feature is disabled&#xff0c;到…

如何在搜索结果出来之前,让页面显示“等待中。。。”

在当前页面点击搜索按纽后&#xff0c;当前页的button onclick事件会生成一个sql语句&#xff0c;然后转到查询结果页面&#xff0c;由于查询可能很费时间&#xff0c;客户要求在这两个页面中加入一个提示用户正在查询&#xff0c;请等待的页&#xff0c;具体的查询是在查询结果…

Strategy_Level1

以下代码是“策略模式”的第三个例子&#xff1a;

波士顿房价预测学习项目笔记

机器学习入门项目 作为机器学习的入门项目&#xff0c;了解到这个一个监督学习类型的回归问题模型。项目中需要根据已有的数据&#xff0c;构建一个合理的模型对未来的房价可以做出预测。 Udacity机器学习课程针对初学者做了精心地设计&#xff0c;这里来看项目是如何组织的&am…

LINQ之路19:LINQ to XML之X-DOM更新、和Value属性交互

本篇包含两部分内容&#xff1a;X-DOM更新一节中我们会详细讨论LINQ to XML的更新方式&#xff0c;包括Value的更新、子节点和属性的更新、通过Parent节点实现更新&#xff1b; 和Value属性交互一节会详细讨论XElement和XAttribute的Value属性。如果一个元素只有单个XText子节点…

明朝是中国历史上最有骨气的王朝?【ZZ】

linked from http://www.guoxue.com/article/list.asp?id6095明朝是中国历史上最有骨气的王朝&#xff1f;作者&#xff1a; &#xff08;国学网2006-5-12发布&#xff09; 有人对明朝极尽污蔑之能事&#xff0c;好象明朝是最不中用的朝代。其实&#xff0c;只要细心比较&am…

马哥第七次作业

系统的INPUT和OUTPUT默认策略为DROP&#xff0c;请完成以下关于iptables的题目&#xff1b;1、限制本地主机的web服务器在周一不允许访问&#xff1b;新请求的速率不能超过100个每秒&#xff1b;web服务器包含了admin字符串的页面不允许访问&#xff1b;web服务器仅允许响应报文…