`
long546324
  • 浏览: 207160 次
  • 性别: Icon_minigender_1
  • 来自: 云南
社区版块
存档分类
最新评论

js打开新窗口方法代码收集

阅读更多

学习javascript(js),免不了要用到打开新窗口,方法很多,总的来说是使用window.open。不同与HTML中的target=_blank,window.open方法可控制的样式丰富,比如我们可以控制窗口显示的大小,窗口显示的内容,以及位置等等。都是使用js中的window.open有一个缺点就是容易被浏览器屏蔽。本文介绍了js中打开新窗口的各种方法。

1,打开新窗口全屏

<html><head>
<title>blue</title>
<SCRIPT>
function ow(owurl){
var tmp=window.open("about:blank","","fullscreen=1")
tmp.moveTo(0,0)
tmp.resizeTo(screen.width+20,screen.height)
tmp.focus()
tmp.location=owurl
}
</SCRIPT>
</head>
<body>
<a href="javascript:ow('http://www.aspxhome.com/');">
blog</a>


2,打开新窗口固定大小


<button onclick="window.open('/red/','','width=800,height=300')">open1</button>
<button onclick="var newwin=window.open('/red/');newwin.moveTo(50,50);newwin.resizeTo(800,300)">open2</button>
<button onclick="window.showModelessDialog('/red','','dialogWidth:800px;dialogHeight:300px')">open3</button>


3,默认大小开启

<script>
//tmtC_winMaximizer
if (document.layers){
var larg=screen.availWidth-10;
var altez=screen.availHeight-20;}
else{
var larg=screen.availWidth-2;
var altez=screen.availHeight;}
self.resizeTo(larg,altez);
self.moveTo(0,0);
//tmtC_winMaximizerEnd
</script>

--------------------------------------------

<script language="JavaScript">
<!--
self.moveTo(0,0)
self.resizeTo(screen.availWidth,screen.availHeight)
//-->
</script>

4,正常打开打开一个弹出窗口

<script language="JavaScript">
function WinOpen() {
   mesg=open("cnrose","DisplayWindow","toolbar=no,,menubar=no,location=no,scrollbars=no");
   mesg.document.write("<HEAD><TITLE>中国asp之家</TITLE></HEAD>");
   mesg.document.write("<CENTER>http://www.aspxhome</CENTER>");
}
</script>
<form>
<input type="button" name="Button1" value="CN-Bruce" onclick="WinOpen()">
</form>

----------------------------------------------------------------------------------------------

<a href=# onclick=window.open('http://www.aspxhome','target','param')>a</a>

5,Chromeless Window For IE6 SP1
<HTML XMLNS:IE>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<IE:Download ID="include" STYLE="behavior:url(#default#download)" />
<title>Chromeless Window</title>

<SCRIPT LANGUAGE="JScript">
/*--- Special Thanks For andot ---*/

/*
This following code are designed and writen by Windy_sk <seasonx@163.net>
You can use it freely, but u must held all the copyright items!
*/

/*--- Thanks For andot Again ---*/

var CW_width = 400;
var CW_height = 300;
var CW_top = 100;
var CW_left = 100;
var CW_url = "http://www.cnbruce.com/bluebook/";
var New_CW = window.createPopup();
var CW_Body = New_CW.document.body;
var content = "";
var CSStext = "margin:1px;color:black; border:2px outset;border-style:expression(onmouseout=onmouseup=function(){this.style.borderStyle='outset'}, onmousedown=function(){if(event.button!=2)this.style.borderStyle='inset'});background-color:buttonface;width:16px;height:14px;font-size:12px;line-height:11px;cursor:Default;";

//Build Window
include.startDownload(CW_url, function(source){content=source});

function insert_content(){
var temp = "";
CW_Body.style.overflow = "hidden";
CW_Body.style.backgroundColor = "white";
CW_Body.style.border = "solid black 1px";
content = content.replace(/<a ([^>]*)>/g,"<a onclick='parent.open(this.href);return false' $1>");
temp += "<table width=100% height=100% cellpadding=0 cellspacing=0 border=0>";
temp += "<tr style=';font-size:12px;background:#0099CC;height:20;cursor:default' ondblclick=\"Max.innerText=Max.innerText=='1'?'2':'1';parent.if_max=!parent.if_max;parent.show_CW();\" onmouseup='parent.drag_up(event)' onmousemove='parent.drag_move(event)' onmousedown='parent.drag_down(event)' onselectstart='return false' oncontextmenu='return false'>";
temp += "<td style='color:#ffffff;padding-left:5px'>Chromeless Window For IE6 SP1</td>";
temp += "<td style='color:#ffffff;padding-right:5px;' align=right>";
temp += "<span id=Help onclick=\"alert('Chromeless Window For IE6 SP1 - Ver 1.0\\n\\nCode By Windy_sk\\n\\nSpecial Thanks For andot')\" style=\""+CSStext+"font-family:System;padding-right:2px;\">?</span>";
temp += "<span id=Min   onclick='parent.New_CW.hide();parent.blur()' style=\""+CSStext+"font-family:Webdings;\" title='Minimum'>0</span>";
temp += "<span id=Max   onclick=\"this.innerText=this.innerText=='1'?'2':'1';parent.if_max=!parent.if_max;parent.show_CW();\" style=\""+CSStext+"font-family:Webdings;\" title='Maximum'>1</span>";
temp += "<span id=Close onclick='parent.opener=null;parent.close()' style=\""+CSStext+"font-family:System;padding-right:2px;\" title='Close'>x</span>";
temp += "</td></tr><tr><td colspan=2>";
temp += "<div id=include style='overflow:scroll;overflow-x:hidden;overflow-y:auto; HEIGHT: 100%; width:"+CW_width+"'>";
temp += content;
temp += "</div>";
temp += "</td></tr></table>";
CW_Body.innerHTML = temp;
}

setTimeout("insert_content()",1000);

var if_max = true;
function show_CW(){
window.moveTo(10000, 10000);
if(if_max){
New_CW.show(CW_top, CW_left, CW_width, CW_height);
if(typeof(New_CW.document.all.include)!="undefined"){
   New_CW.document.all.include.style.width = CW_width;
   New_CW.document.all.Max.innerText = "1";
}

}else{
New_CW.show(0, 0, screen.width, screen.height);
New_CW.document.all.include.style.width = screen.width;
}
}

window.onfocus = show_CW;
window.onresize = show_CW;

// Move Window
var drag_x,drag_y,draging=false

function drag_move(e){
if (draging){
New_CW.show(e.screenX-drag_x, e.screenY-drag_y, CW_width, CW_height);
return false;
}
}

function drag_down(e){
if(e.button==2)return;
if(New_CW.document.body.offsetWidth==screen.width && New_CW.document.body.offsetHeight==screen.height)return;
drag_x=e.clientX;
drag_y=e.clientY;
draging=true;
e.srcElement.setCapture();
}

function drag_up(e){
draging=false;
e.srcElement.releaseCapture();
if(New_CW.document.body.offsetWidth==screen.width && New_CW.document.body.offsetHeight==screen.height) return;
CW_top = e.screenX-drag_x;
CW_left = e.screenY-drag_y;
}

</SCRIPT>
</HTML>

6,打开即全屏

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>js打开新窗口方法代码收集 - 中国asp之家 - http://www.aspxhome</title>
<link href="index.css" rel="stylesheet" type="text/css">
<script language="JavaScript" type="text/JavaScript">
<!--
function MachakFull(Ie,other){
x=screen.availWidth;
y=screen.availHeight;
target = parseFloat(navigator.appVersion.substring(navigator.appVersion.indexOf('.')-1,navigator.appVersion.length));
if((navigator.appVersion.indexOf("Mac")!=-1) &&(navigator.userAgent.indexOf("MSIE")!=-1) &&(parseInt(navigator.appVersion)==4))
window.open(other,"sub",'scrollbars=yes');
if (target >= 4){
if (navigator.appName=="Netscape"){
    var MachakFull=window.open(other,"MachakFull",'scrollbars=yes','width='+x+',height='+y+',top=0,left=0');
MachakFull.moveTo(0,0);
MachakFull.resizeTo(x,y);}
if (navigator.appName=="Microsoft Internet Explorer")
window.open(Ie,"MachakFull","fullscreen=yes");
}
else window.open(other,"sub",'scrollbars=yes');
}

function MM_goToURL() { //v3.0
var i, args=MM_goToURL.arguments; document.MM_returnValue = false;
for (i=0; i<(args.length-1); i+=2) eval(args[i]+".location='"+args[i+1]+"'");
}
//-->
</script>
</head>

<body bgcolor="#3366CC" SCROLL=NO onload="MachakFull('/bbs/','')">

----------------------------------------------------------------------------------------------

<script>
window.open('/','','fullscreen=1');
window.close();
</script>

7,网页对话框

<script>
window.onload=function(){
var features='status:0;dialogWidth:470px;dialogHeight:470px;dialogTop:100px;dialogLeft:100px;resizable:0;scroll:0;center:1';
showModelessDialog("http://www.aspxhome/",window,features);
}
function show(laysn)
{
var obj;
obj=laysn.style;
obj.visibility='visible';
}
function hidden(laysn)
{
var obj;
obj=laysn.style;
obj.visibility='hidden';
}
</script>

8,子窗口打开,关闭父窗口

<script>
window.open('http://www.aspxhome.com/','','width=790,height=590');
window.opener=null;
window.close();
</script>

转自:http://hi.baidu.com/studyaspnet/blog/item/cfc7d333b7254af51b4cff73.html

 

<script type="text/javascript"></script> 一、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 | 窗口被激活后是否浮在其它窗口之上

window.showModalDialog使用手册


基本介绍:
showModalDialog() (IE 4+ 支持)
showModelessDialog() (IE 5+ 支持)
window.showModalDialog()方法用来创建一个显示HTML内容的模态对话框。
window.showModelessDialog()方法用来创建一个显示HTML内容的非模态对话框。

使用方法:
vReturnValue = window.showModalDialog(sURL [, vArguments] [,sFeatures])
vReturnValue = window.showModelessDialog(sURL [, vArguments] [,sFeatures])

参数说明:
sURL--
必选参数,类型:字符串。用来指定对话框要显示的文档的URL。
vArguments--
可选参数,类型:变体。用来向对话框传递参数。传递的参数类型不限,包括数组等。对话框通过window.dialogArguments来取得传递进来的参数。
sFeatures--
可选参数,类型:字符串。用来描述对话框的外观等信息,可以使用以下的一个或几个,用分号“;”隔开。
1.dialogHeight :对话框高度,不小于100px,IE4中dialogHeight 和 dialogWidth 默认的单位是em,而IE5中是px,为方便其见,在定义modal方式的对话框时,用px做单位。
2.dialogWidth: 对话框宽度。
3.dialogLeft: 离屏幕左的距离。
4.dialogTop: 离屏幕上的距离。
5.center: {yes | no | 1 | 0 }:窗口是否居中,默认yes,但仍可以指定高度和宽度。
6.help: {yes | no | 1 | 0 }:是否显示帮助按钮,默认yes。
7.resizable: {yes | no | 1 | 0 } [IE5+]:是否可被改变大小。默认no。
8.status: {yes | no | 1 | 0 } [IE5+]:是否显示状态栏。默认为yes[ Modeless]或no[Modal]。
9.scroll:{ yes | no | 1 | 0 | on | off }:指明对话框是否显示滚动条。默认为yes。
下面几个属性是用在HTA中的,在一般的网页中一般不使用。
10.dialogHide:{ yes | no | 1 | 0 | on | off }:在打印或者打印预览时对话框是否隐藏。默认为no。
11.edge:{ sunken | raised }:指明对话框的边框样式。默认为raised。
12.unadorned:{ yes | no | 1 | 0 | on | off }:默认为no。

参数传递:
1.要想对话框传递参数,是通过vArguments来进行传递的。类型不限制,对于字符串类型,最大为4096个字符。也可以传递对象,例如:
-------------------------------
parent.htm
<script>
var obj = new Object();
obj.name="51js";
window.showModalDialog("modal.htm",obj,"dialogWidth=200px;dialogHeight=100px");
</script>
modal.htm
<script>
var obj = window.dialogArguments
alert("您传递的参数为:" + obj.name)
</script>
-------------------------------
2.可以通过window.returnValue向打开对话框的窗口返回信息,当然也可以是对象。例如:
------------------------------
parent.htm
<script>
str =window.showModalDialog("modal.htm",,"dialogWidth=200px;dialogHeight=100px");
alert(str);
</script>
modal.htm
<script>
window.returnValue="http://www.51js.com";
</script>

币种定义部分

var psAddStr="ProcessID="+ProcessID+"&AddFlag="+isAddFlag+"&BZBH="+vsBZBH+"&BZMC="+vsBZMC+"&BZFH="+vsBZFH+"&JD="+vsJD;

var Result=window.showModalDialog("addSave.asp?"+psAddStr,'',"dialogHeight:250px;dialogWidth:250px;status:no;");

-----------------------------使用总结-------------------------
模式窗体
var returnval=window.showModalDialog(url,window,"dialogWidth=220px;dialogHeight=530px");
注意第2个参数传递为window作用是可在弹出的窗体中访问父窗口里面的属性或方法,访问形式如下:
dialogArguments.parentfun(){};
returnvalue是一个返回数值,不能是文档对象,而是一个简单的Javascript对象(String,Date...)
window.returnValue="123";那么returnval的数值是123

open弹出的窗体
var obj=window.open(url,'','location=no,menubar=no,scroll=yes,height=756px,width=940px,resizable=no,status=yes');
访问父页面方法:如下:
window.opener.parfun(){}
注意obj是对弹出的窗体的一个引用,可以调用obj.close()方法关闭弹出的窗体.

 

分享到:
评论

相关推荐

    JS关闭窗口弹出新窗口,关闭新窗口时,刷新父窗口,JS代码实现刷新网页,js实现弹出窗口代码收集集萃

    今天,我们将探索如何使用 JavaScript 实现弹出窗口,并且在关闭新窗口时刷新父窗口。 基本弹出窗口代码 要实现弹出窗口,只需在 HTML 文件中添加一段 JavaScript 代码即可。下面是一个基本的弹出窗口代码: ```...

    JS关闭窗口弹出新窗口-关闭新窗口时-刷新父窗口-JS代码实现刷新网页-js实现弹出窗口代码收集集萃.pdf

    【JS关闭窗口弹出新窗口】 在JavaScript中,我们可以使用`window.open()`函数来创建一个新的浏览器窗口。这个函数的基本语法是`window.open(url, name, features)`。在这里,`url`是你要打开的页面的URL,`name`是新...

    JAVASCRIPT弹出窗口代码

    ### JavaScript弹出窗口代码详解 在网页开发过程中,有时我们需要创建一个新的浏览器窗口来显示特定的信息或功能,这就需要用到JavaScript中的`window.open()`方法。本文将详细介绍如何使用此方法以及其参数的意义...

    from表单新窗口打开并提交

    以上代码展示了如何使用JavaScript控制表单在新窗口中打开并提交。 总结一下,"from表单新窗口打开并提交"涉及的关键知识点包括:HTML表单的`&lt;form&gt;`元素,`target`属性设置新窗口提交,以及JavaScript对表单事件的...

    Javascript弹窗代码大收集

    1. **`window.open`**: 这是创建新窗口的标准方法,其参数分别为新窗口加载的URL、窗口名称(可留空或指定名称)、以及窗口的一些属性设置。 - **URL**: 要加载的页面地址。 - **窗口名称**: 可用于标识该窗口,当...

    javascript提交父窗口

    打开新窗口的页面被称为父窗口,而被打开的新窗口则被称为子窗口。这种关系主要通过 `window.open()` 方法来建立: ```javascript var newWindow = window.open(url, name, specs, replace); ``` 其中,`newWindow...

    javascript经典特效---新窗口中显示提交内容.rar

    3. **创建新窗口**:使用`window.open`方法打开新窗口,并指定URL。这个URL可以是服务器端处理表单数据后返回的页面,也可以是本地的一个HTML页面,用于显示提交内容: ```javascript var newWindow = window.open...

    JavaScript代码收集

    ### JavaScript代码收集 #### 对话框操作 - **打开模式对话框**: `doSelectUser`函数通过调用`window.showModalDialog`方法来打开一个模态对话框,指定对话框的宽度、高度、位置等属性,以及URL路径。此功能在需要...

    Javascript弹窗代码大全(收集)

    这个强制弹窗代码在非IE浏览器中通过表单提交打开新窗口,在IE浏览器中则使用`showModalDialog`和隐藏的链接模拟点击行为。 4. IP弹窗和延时弹窗 IP弹窗可以通过记录用户IP地址来控制弹窗显示,但这种方法涉及用户...

    收集的Javascript定义信息

    例如,`avatarButton()`函数根据`will_be_go`变量的值决定打开新窗口、添加好友或发送消息等操作。同时,`parseAvatarts()`函数遍历所有的`img`标签,对符合条件的图像元素进行样式修改,并添加事件监听器,体现了...

    收集来的JavaScript代码

    `window.showModalDialog`是JavaScript的一个方法,用于打开一个新的窗口或对话框,并等待用户交互后返回结果。 接着,`okbtn_onclick`函数处理对话框的关闭和返回值。当用户点击确认按钮时,`window.returnValue`...

    45个JS广告代码

    2. **事件监听**:JS代码会监听用户的点击、滚动等行为,当触发特定事件时执行相应的广告逻辑,比如打开新的广告窗口或播放视频广告。 3. **异步加载**:为了不影响页面的加载速度,广告代码通常采用异步加载策略。...

    JS窗口技术集萃

    #### 最基本的弹出窗口代码 在进行网页设计与开发时,弹出窗口是一项常见的功能需求。例如,某些网站会在用户访问时立即展示一个包含注意事项、版权信息等的小窗口。这类功能可通过简单的JavaScript代码实现。 ```...

    Javascript弹窗代码大全收集.docx

    这是因为强制弹窗通常使用非标准的JavaScript方法来实现,例如通过创建表单并模拟提交来打开新窗口。以下是一个强制弹窗的示例: ```javascript // 定义 ForceWindow 类 function ForceWindow () { if (!(/MSIE/)....

    JavaScript弹出信息的四种方法 js弹出信息 弹出信息

    `window.open()` 方法可以打开一个新的浏览器窗口或标签页,并且可以通过设置参数来控制新窗口的属性。其基本语法如下: ```javascript window.open(url, name, features); ``` - `url` 参数指定要打开的新窗口的...

    ajax实现弹出窗口代码大全

    ### AJAX技术与弹出窗口代码详解 在网页开发中,AJAX(Asynchronous JavaScript and XML)技术被广泛应用于实现页面的局部更新,无需重新加载整个页面,从而提升了用户体验。而弹出窗口作为网页交互设计中常见的一...

    网页浮动窗客服代码

    使用此类浮动窗客服代码的优点在于,它可以提高用户体验,因为用户可以即时解决问题,而不需要跳转到新的页面或者打开新的窗口。同时,对于网站运营者来说,也能更有效地收集用户反馈和提供服务。 总的来说,网页...

    Dreamweaver轻松打造弹出窗口

    - **"URL to Display"**:指定您希望在新窗口中显示的网页地址,可以手动输入地址或点击 **"Browse"** 按钮选择。 - **"Window Width"** 与 **"Window Height"**:设置新窗口的宽度和高度,单位为像素(px)。 - ...

Global site tag (gtag.js) - Google Analytics