`
天边一朵雲
  • 浏览: 36315 次
  • 性别: Icon_minigender_1
  • 来自: 成都
社区版块
存档分类
最新评论

(笔记)javascript弹出窗口总结

阅读更多

一:window.open()弹出窗口

语法格式:

var returnValue = window.open(URL,windowname[,location]);

 

参数解释:
URL : 打开窗口的html地址

windowname : window对象的名称

location : 弹出窗口属性设置参数

returnValue 的值不为空则open成功

 

 

location参数设置可选参数
属性 说明
width 窗口宽度
height 窗口高度
scrollbars 是否显示滚动条
resizable 设置窗口大小是否固定
toolbar 设置浏览器工具条
menubar 设置菜单条
location 设置地址栏
direction 设置刷新按钮

 

实例:

JS代码
<script>
        window.onload = function(){
	    var winal = window.open("Hello_World.html", "openwindow"); 
        }
</script
弹出窗HTML代码
<body>
        <p style="color:red;">Hello World!</p>
</body>


效果:.

.

 

弹出窗口关闭:

window.close();


弹出窗口居中显示:

<script>
        window.onload = function(){
	    var winal = window.open("Hello_World.html", "openwindow","width=100,height=50"); 
             var width = screen.width;
             var heigth = screen.height;
             winal.moveTo((width-100)/2,(height-50)/2);
        }
</script


二: window.showModalDialog()弹出窗口

语法格式:

vReturnValue = window.showModalDialog(sURL [, vArguments] [,sFeatures])


参数解释:

sURL:必选参数,类型:字符串。用来指定对话框要显示的文档的URL。
vArguments:可选参数,类型:变体。用来向对话框传递参数。传递的参数类型不限,包括数组等。对话框通过window.dialogArguments来取得传递进来的参数。
sFeatures:可选参数,类型:字符串。用来描述对话框的外观等信息,可以使用以下的一个或几个,用分号“;”隔开。

 

 

sFeature参数设置可选参数

dialogHeight:

对话框高度,不小于100px

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。

 

实例1(有参数的情况):

var obj = new Object();
obj.name="51js";
window.showModalDialog("modal.htm",obj,"dialogWidth=200px;dialogHeight=100px");

 

获取参数:

var obj = window.dialogArguments;
alert("您传递的参数为:" + obj.name);


实例2(无参数的情况):

str =window.showModalDialog("modal.htm",,"dialogWidth=200px;dialogHeight=100px");

 

转自:www.itlanguageexpress.info

分享到:
评论

相关推荐

    javascript点击弹出窗口.zip

    总之,这个压缩包提供了从基础到高级的JavaScript弹出窗口实现示例,结合HTML5和AJAX技术,以及CSS样式和图像资源。开发者可以根据自身需求对这些代码进行二次修改,以适应不同项目的需求。无论是学习JavaScript交互...

    自用弹出窗口jquery

    利用jQuery,开发者可以更轻松地实现复杂的网页交互效果,例如弹出窗口,而无需编写大量的JavaScript代码。 关于【压缩包子文件的文件名称列表】: 1. **jquery.yxDialog.js**:这是主要的插件脚本文件,包含了弹...

    javaScript学习笔记总结.docx

    BOM允许开发者获取和操作浏览器的信息,如浏览器窗口大小、历史记录、弹出对话框等功能。DOM则提供了操作HTML文档的方法,允许通过JavaScript动态修改网页内容。通过DOM,我们可以查找、添加、删除或修改HTML元素,...

    纯css实现的DIV弹出窗口,周围变暗效果代码.zip

    JavaScript(可能是jQuery)将监听用户触发弹出窗口的事件,并动态改变CSS类或属性,以显示弹出窗口和添加/移除背景的暗化效果。 在实际应用中,开发者可能会根据项目需求调整这些参数,例如改变暗化层的颜色、透明...

    jQuery点击弹出窗口幻灯片图片切换代码.zip

    在代码中,通常会有一个触发弹出窗口的按钮或链接,以及一个隐藏的弹出层,用于展示图片。当用户点击按钮时,通过JavaScript操作显示这个弹出层,并加载图片。 2. **js**:这部分是JavaScript代码,主要负责处理...

    jQuery实现网页右下角弹出窗口特效.zip

    5. **js**:这个目录很可能包含了实现弹出窗口特效的JavaScript代码。可能有一个名为`main.js`或类似的文件,其中包含对DOM元素的操作、事件监听和动画逻辑。例如,使用jQuery选择器找到按钮元素,添加点击事件监听...

    JavaScript-学习笔记.pdf

    以上是JavaScript学习笔记中提到的一些核心知识点,通过对这些知识点的理解和熟练应用,可以为进一步学习和掌握JavaScript打下坚实的基础。在实际开发过程中,结合具体的项目需求,这些知识会得到更深入的拓展和应用...

    jquery模拟人人网注册大学选择页面弹出窗口.zip

    本教程将详细讲解如何利用HTML5技术,特别是JavaScript和CSS,来模拟人人网注册时的大学选择页面弹出窗口。这个功能在网页应用中常见,能提升用户体验,使用户在不离开主页面的情况下完成操作。 首先,我们来看看...

    CSS3实现带阴影边框效果弹出窗口.zip

    在本资源"CSS3实现带阴影边框效果弹出窗口.zip"中,包含了一系列用于创建具有阴影边框效果的弹出窗口的代码和技术。这个压缩包主要包括四个文件:index.html、css、js和images,它们共同协作实现了这个功能。下面...

    js按钮弹出窗口远程调用淘宝网登陆页面.zip

    【标题】"js按钮弹出窗口远程调用淘宝网登陆页面.zip" 提供了一个使用JavaScript技术实现的功能,即通过点击按钮在弹出窗口中打开淘宝网的登录页面。这一技术在网页交互设计中常见,主要用于增强用户体验,比如提供...

    jQuery点击弹出窗口放大图片和PDF文件预览插件.zip

    2. **弹出窗口**:可能是使用模态对话框(modal dialog)或者浮动层(lightbox)实现,用于显示图片或PDF预览。jQuery UI和Bootstrap都提供了创建此类效果的工具。 3. **图片预览**:可能使用`&lt;img&gt;`标签的`src`属性...

    支持弹出多个窗口的jQuery弹窗插件

    本文将详细解析"支持弹出多个窗口的jQuery弹窗插件",即popupWindow.js,它是jQuery插件家族中的一个重要成员,主要用于创建具有多种功能的弹出窗口。 首先,popupWindow.js的核心特性是它支持弹出多个窗口,这意味...

    JavaScript达内学习笔记

    - **与网页交互**:例如通过点击按钮弹出窗口或更改页面元素的状态。 - **获取浏览器信息**:如浏览器类型、版本等。 - **AJAX关键技术**:利用JavaScript可以操作浏览器内置的对象`XmlHttpRequest`实现异步数据...

    燕十八javascript笔记

    - **`alert()`**: 用于弹出一个包含消息的对话框,常用于向用户显示提示信息。它是一个简单有效的工具,可以帮助开发者快速测试脚本或向用户展示重要的通知。 #### 二、JavaScript与DOM关系详解 - **DOM (Document...

    总结javascript鼠标事件笔记

    5. oncontextmenu:右键菜单弹出时触发,可以自定义菜单选项。 6. ondrag*:拖放事件系列,用于处理拖放操作的各个阶段。 7. onlosecapture:元素失去鼠标捕获时触发。 外部事件: 1. onafterprint、onbeforeprint...

    js-file-download:此代码是使用JavaScript在网页中打开下载文件弹出窗口的最佳解决方案

    此代码是使用JavaScript在网页中打开下载文件弹出窗口的最佳解决方案。 如果您需要使用javascript将文件下载到客户端浏览器,则只需要使用filePath网址作为输入参数来调用downloadFile&#40;filePath&#41;函数,它将...

    JavaScript学习笔记

    2. **Browser Object Model (BOM)**:浏览器对象模型允许开发者通过JavaScript操作浏览器窗口和其属性,例如弹出警告框、操作浏览器的历史记录等。 3. **Document Object Model (DOM)**:文档对象模型允许开发者通过...

    javascript个人技术笔记

    1 Cookie对象的运用; 2 JavaScript窗口功能指南之打开一个新...4 利用弹出式窗口收集数据; 5 窗口对象的属性和方法; 。。。等等25个javaScript相关技术的DOC文档。希望对正在学习或做javaScript项目的朋友有帮助。

    Javascript笔记

    3. **变量输出**:PHP中使用`echo`输出变量,而JavaScript中则使用`alert()`来弹出提示框显示变量内容。 4. **取消标签的默认行为**:在HTML中,可以使用`javascript:`伪协议或者`javascript:void(0)`来阻止超链接和...

Global site tag (gtag.js) - Google Analytics