`

弹出窗口两种方式

 
阅读更多
 1.window.showModalDialog:
      var feature = "dialogWidth:615px;dialogHeight:505px;status:no;help:no;scroll:no;resizable:no;center:yes";
      window.showModalDialog(url, Object(传给弹出窗口的参数,可以是任何类型),feature) 
      决定窗口的外观是第三个参数feature,其中center属性指定为"yes",弹出窗口居中;
      如果想手动指定弹出窗口的具体位置,去掉center属性,
       用dialogTop(弹出窗口上边界居屏幕上的距离)
       dialogLeft(弹出窗口左边界居屏幕左的距离)属性
      如:(距离是px像素),这里手动指定弹出窗口位置居中
      var iTop = (window.screen.availHeight-550)/2; //获得窗口的垂直位置,550为弹出窗口的height;
      var iLeft = (window.screen.availWidth-640)/2; //获得窗口的水平位置,640为弹出窗口的width;
      var feature = "dialogWidth:615px;dialogHeight:505px;status:no;help:no;scroll:no;resizable:no;dialogTop:'+iTop+';dialogLeft:'+iLeft+';";
    2.window.open:  
      var feature = "width=615,height=505,menubar=no,toolbar=no,location=no,scrollbars=no,status=no,modal=yes"
      window.open(url, window(弹出窗口的名字), feature) 
      手动指定弹出窗口位置,属性top:(弹出窗口上边界居屏幕上的距离)
                            属性left:(弹出窗口左边界居屏幕左的距离)
      下面指定弹出窗口位置居中(这种方式没有center属性):
       var iTop = (window.screen.availHeight-550)/2; //获得窗口的垂直位置,550为弹出窗口的height;
      var iLeft = (window.screen.availWidth-640)/2; //获得窗口的水平位置,640为弹出窗口的width;
      var feature = "width=615,height=505,top="+iTop+",left="+iLeft+",menubar=no,toolbar=no,location=no,scrollbars=no,status=no,modal=yes";
   
   子窗口调用父窗口的东东(控件或者方法):
   1. window.open打开的子窗口有window.opener属性
     子窗口通过window.opener.xxxx获得父窗口的东东。
     如:window.opener.document.getElementById("userName");得到父页面的控件。
       window.opener.fresh();调用父页面的js方法。
   2. window.showModalDialog:不支持window.opener,
      父窗口通过showModalDialog(url,para,feature)第二个参数para传参数给子窗口,
      子窗口通过window.dialogArguments获得父窗口穿过来的东西。及获得传过来的的二个参数
      子窗口通过window.dialogArguments.xxxx获得父窗口的东东。
      
      如:这里传父页面的的window过去
        父页面:showModalDialog(url,window,feature)
       子页面:var name = window.dialogArguments.document.getElementById("userName").value;得到父页面的控件。
            var name = window.dialogArguments.fresh();调用父页面的方法。
      这里的window.dialogArguments就相当于父页面的window,它是通过showModalDialog方法的第二个参数window传过来的,
      当然也可以传数组或其它变量。
      showModalDialog(url,[1,2,3],feature) //父页面传一个数组给子窗口
      showModalDialog(url,window,feature) //父页面把自己的window参数传给子窗口
分享到:
评论

相关推荐

    弹出窗口效果

    在网页设计中,弹出窗口是一种常见的交互元素,用于显示重要的信息、提示用户操作或提供扩展功能。"jQuery + CSS 实现绚丽的弹出窗口效果"这个主题涉及到两个关键的技术:JavaScript 库 jQuery 和样式语言 CSS。它们...

    PROFACE触摸屏弹出窗口的制作方法.pdf

    建立弹出窗口有两种方法:一种是使用“窗口注册”的方法,另一种是使用“窗口画面记录”的方法。 首先,使用“窗口注册”的方法。在基本画面中使用“窗口注册”的方法,具体步骤如下:点击“新建”按钮,新建一个...

    JS弹出窗口JS弹出窗口JS弹出窗口JS弹出窗口

    本篇文章将详细探讨JS弹出窗口的实现方式和相关知识点。 首先,JS中最常见的弹出窗口是`alert()`函数。它会显示一个带有消息的单一按钮对话框,用户点击按钮后关闭对话框,程序继续执行。例如: ```javascript ...

    弹出窗口

    10. **模态与非模态**:弹出窗口有两种主要类型:模态和非模态。模态窗口阻止用户与主界面交互,直到弹出窗口被关闭;而非模态窗口允许用户同时操作主界面和弹出窗口。 以上是关于“弹出窗口”这个主题的一些关键...

    javascript经典特效---无边弹出窗口全集.rar

    弹出窗口通常分为两种类型:模态(Modal)和非模态(Non-Modal)。模态弹出窗口会阻止用户与主页面的交互,直到弹出窗口被关闭;而非模态弹出窗口则允许用户在弹出窗口和主页面之间自由切换。 实现弹出窗口的...

    js-弹出窗口

    在本案例中,我们将探讨如何利用这两个强大的工具来实现一个简单的弹出窗口。 首先,我们需要理解JavaScript的基本概念。JavaScript是一种解释型的、弱类型的、基于原型的语言,它主要用于网页和网络应用的客户端...

    百度的弹出窗口

    首先,JavaScript弹出窗口通常通过以下几种方式创建: 1. `window.alert()`: 这个函数用于显示一个警告对话框,包含一条消息和一个确认按钮。用户必须点击确认按钮才能关闭窗口,因此常用于需要用户注意的重要信息...

    9种js弹出动态窗口的 php代码

    2. **弹出窗口类型**:动态窗口通常包括模态对话框(modal dialogs)、提示框(alert boxes)、确认框(confirm boxes)、信息框(information boxes)以及自定义窗口。每种类型的弹窗都有其特定的用途,如模态...

    弹出窗口互相传值范例

    在IT行业中,弹出窗口(通常指的是模态窗口)是一种常见的用户界面设计,用于提供额外的信息或交互功能,而不中断用户对主界面的操作。在这个"弹出窗口互相传值范例"中,我们将会探讨如何在不同的弹出窗口之间传递...

    js 弹出页面+弹出窗口

    在JavaScript(JS)中,弹出页面和弹出窗口是两种常见的用户交互方式,它们能够提供额外的信息或者增强用户体验。本文将深入探讨如何利用JS实现这两种功能。 首先,"弹出页面"通常指的是在一个新浏览器窗口中打开一...

    Android炫酷的弹出窗口

    在Android中,弹出窗口通常分为两种类型:AlertDialog和PopupWindow。AlertDialog是系统提供的标准对话框,它提供了固定的样式和行为,而PopupWindow则更为灵活,允许开发者自定义布局和行为,可以实现各种定制化的...

    弹出窗口__iframe

    标题中提到的"iframe"与弹出窗口的结合,可能是为了在弹出窗口中展示iframe内容,从而提供一种特定的用户体验。例如,创建一个可自定义大小的弹出窗口,其中包含一个iframe,用于显示特定的Web应用或信息。 描述中...

    Flex 弹出窗口代码

    在Flex编程中,"弹出窗口代码"是一个常见的需求,特别是在设计用户交互界面时,我们经常需要实现点击按钮后打开一个新的窗口或者对话框来展示更多信息或进行特定操作。本篇将详细讲解如何在Flex中创建一个点击按钮后...

    javascript 弹出窗口

    在JavaScript编程中,弹出窗口是一种常见的用户交互方式,它能够提供信息提示、确认操作或者展示更复杂的对话框。在给定的标题“javascript 弹出窗口”和描述“推荐一个非常好用的javascript弹出窗口控件”中,我们...

    JQUERY 弹出窗口

    弹出窗口通常分为两种类型:模态(Modal)和非模态(Non-Modal)。模态弹出窗口阻止用户与页面其他部分互动,直到弹出窗口被关闭;而非模态弹出窗口允许用户同时与弹出窗口和背景页面交互。在jQuery中,我们可以使用...

    css3-弹出窗口弹出效果

    过渡效果允许元素在两个样式之间平滑地变化,比如在弹出窗口打开或关闭时。通过指定`transition: property duration timing-function delay`,我们可以控制特定属性(如宽度、高度、透明度等)的变化速度和方式。...

    两种仿SNS的winform弹出窗口

    本话题将深入探讨两种不同的Winform弹出窗口实现方式,以及如何利用这些技术提升应用程序的交互性和吸引力。 首先,"网上流行的多皮肤的仿sns的弹出窗口"通常指的是那些可以自定义外观,以适应不同用户喜好的弹窗...

    javascript经典特效---弹出窗口自动关闭.rar

    在JavaScript编程领域中,弹出窗口是一种常见的交互方式,它用于显示额外的信息或者进行特定的操作。本资源"javascript经典特效---弹出窗口自动关闭.rar"着重于实现弹出窗口的自动关闭功能,这一特性在很多网页应用...

    弹出窗口的创建

    在JavaScript编程中,弹出窗口是一种常见的交互方式,用于向用户显示信息或获取用户的输入。在给定的代码段中,我们看到一个名为`Windows`的函数,它用于创建自定义的弹出窗口。这个函数提供了更灵活的控制,比如...

Global site tag (gtag.js) - Google Analytics