`
jxiaoan
  • 浏览: 1211 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

转:javascript 弹出窗口返回值 (open, showModalDialog)

阅读更多

test.php

 

Html代码 复制代码
  1. <form name="form1" method="post" action="">  
  2.     <a href="javascript:void(null)" class="add" onClick="open('demo.php','','resizable=1,scrollbars=1,status=no,toolbar=no,menu=no,width=500,height=400,left=150,top=50')">增加</a>  
  3.     <input type="text" name="text1">  
  4. </form>  
<form name="form1" method="post" action="">
	<a href="javascript:void(null)" class="add" onClick="open('demo.php','','resizable=1,scrollbars=1,status=no,toolbar=no,menu=no,width=500,height=400,left=150,top=50')">增加</a>
	<input type="text" name="text1">
</form>

 

demo.php

 

Html代码 复制代码
  1. <script language="javascript" type="text/javascript">  
  2.     function returnValue()   
  3.     {   
  4.         window.opener.document.all.text1.value=document.getElementById("returnText").value;   
  5.         window.close();   
  6.     }   
  7. </script>  
  8. <p>  
  9.     <input type="button" name="Submit" value="提交" onclick="returnValue();">  
  10.     <input name="returnText" type="text" id="returnText">  
  11. </p>  
<script language="javascript" type="text/javascript">
	function returnValue()
	{
		window.opener.document.all.text1.value=document.getElementById("returnText").value;
		window.close();
	}
</script>
<p>
    <input type="button" name="Submit" value="提交" onclick="returnValue();">
    <input name="returnText" type="text" id="returnText">
</p>

 

 

补充:window.opener 的用法



window.opener 的用法在一般的用法中,只是用来解决关闭窗口时不提示弹出窗口, 而对它更深层的了解一般比较少。其 实 window.opener是指调用window.open方法的窗口。在工作中主要是用来解决部分提交的。这种跨页操作对工作是非常有帮助的。


如果你在主窗口打开了一个页面,并且希望主窗口刷新就用这个,打开页面的window.opener就相当于主窗口的window。


主窗口的刷新你可以用 window.opener.location.reload();


如果你要提交主窗口: 你可以改成这样 window.opener.yourformname.submit()

 

 

实例2:open

 

test.php

 

Html代码 复制代码
  1. <script  language="JavaScript">  
  2.     var a = '';     
  3.     window.open("test3.php");     
  4.     function button1_onclick()   {     
  5.         alert(a);     
  6.     }     
  7. </script>     
  8.   
  9. <input type="button" id="button1" name="button1" value="Button" onclick="return button1_onclick()" />  
<script  language="JavaScript">
	var a = '';  
    window.open("test3.php");  
	function button1_onclick()   {  
		alert(a);  
	}  
</script>  

<input type="button" id="button1" name="button1" value="Button" onclick="return button1_onclick()" />

 

 

test3.php

 

Html代码 复制代码
  1. <script  language="JavaScript">  
  2.     function   sendTo()     
  3.     {     
  4.         window.opener.a='test';      
  5.         window.close();   
  6.     }     
  7. </script>     
  8.   
  9. <form id="form1" name="form1">     
  10.     <input type="button" id="button1" name="button1" value="返回" onclick="sendTo()" />     
  11. </form>     
<script  language="JavaScript">
    function   sendTo()  
    {  
        window.opener.a='test';   
		window.close();
    }  
</script>  

<form id="form1" name="form1">  
	<input type="button" id="button1" name="button1" value="返回" onclick="sendTo()" />  
</form>   

 

 

实例3:showModalDialog

 

test.php

 

Html代码 复制代码
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
  2. <html xmlns="http://www.w3.org/1999/xhtml">  
  3. <head>  
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
  5. <title>弹出窗口</title>  
  6. <script  language="JavaScript">  
  7. function pop()   
  8. {   
  9.     var arr = showModalDialog("test5.php", "", "dialogWidth:400; dialogHeight:400; status:0");   
  10.     if (arr != null){   
  11.         alert('您点击了:' + arr);   
  12.     }   
  13. }   
  14. </script>  
  15. </head>  
  16. <body>  
  17.   
  18. <div align="center"><input type="button" value="点我弹出窗口" onclick="pop()" /></div>  
  19.   
  20. </body>  
  21. </html>  
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>弹出窗口</title>
<script  language="JavaScript">
function pop()
{
	var arr = showModalDialog("test5.php", "", "dialogWidth:400; dialogHeight:400; status:0");
	if (arr != null){
		alert('您点击了:' + arr);
	}
}
</script>
</head>
<body>

<div align="center"><input type="button" value="点我弹出窗口" onclick="pop()" /></div>

</body>
</html>

 

test5.php

 

Html代码 复制代码
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
  2. <html xmlns="http://www.w3.org/1999/xhtml">  
  3. <head>  
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
  5. <title>弹出窗口</title>  
  6. <script>  
  7.     function check(s){   
  8.         window.returnValue = s;   
  9.         window.opener=null;   
  10.         window.close();   
  11.     }   
  12. </script>  
  13. </head>  
  14.   
  15. <body>  
  16.     <table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">  
  17.       <tr align="center">    
  18.         <td>点击链接:</td>  
  19.         <td><a href="#" onclick="check('Share JavaScript')">Share JavaScript</a></td>  
  20.         <td><a href="#" onclick="check('share.com')">share.com</a></td>  
  21.     </tr>  
  22.     </table>  
  23. </body>  
  24. </html>  
分享到:
评论

相关推荐

    javascript弹出窗口命令总结

    ### JavaScript 弹出窗口命令总结 #### 一、概述 在网页开发中,JavaScript 提供了多种用于创建弹出窗口的方法。这些方法可以帮助开发者在不离开当前页面的情况下展示额外的信息或进行用户交互。本文将详细介绍 `...

    弹出窗口大全(js)

    该函数与 `g_OpenWindow()` 类似,但增加了返回值的支持,可以在弹出窗口关闭时获取到数据。 代码实现如下: ```javascript function g_OpenReturnWindow(pageURL, innerWidth, innerHeight) { var screenWidth = ...

    showModalDialog使用例子,父窗口向子窗口传递值,子窗口设置父窗口的值,子窗口关闭的时候返回值到父窗口

    在JavaScript中,`showModalDialog`是一个非常有用的函数,它允许我们打开一个新的浏览器窗口或对话框,并与父窗口进行交互。这个功能在开发过程中经常用于创建弹出式表单、确认对话框或者需要用户输入信息的场景。...

    window.showModalDialog以及window.open用法简介

    在网页开发中,有时我们需要打开新的窗口或者弹出对话框来与用户进行交互。`window.showModalDialog`和`window.open`是JavaScript中用于实现这一目标的两个关键函数。它们都可以创建新窗口,但有着不同的特性和使用...

    window.showModalDialog模式对话框和 window.open的区别

    在Web开发中,创建弹出窗口是常见的交互方式,用于显示一些额外的信息或者进行特定的操作。`window.showModalDialog` 和 `window.open` 都是JavaScript提供的两种打开新窗口的方法,但它们在功能和使用场景上有着...

    showModalDialog和open方法demo实例

    在JavaScript中,`showModalDialog`和`window.open`是两个用于打开新窗口或对话框的方法,它们在网页交互和用户界面设计中扮演着重要角色。这篇文章将详细讲解这两个方法的功能、用法以及它们的区别。 首先,我们来...

    ShowModalDialog与window.open的区别

    JavaScript 提供了两种常用的方法来创建这类窗口:`ShowModalDialog` 和 `window.open`。这两种方法各有特点,在不同的场景下具有不同的适用性。 #### 二、ShowModalDialog详解 **1. 功能介绍** `ShowModalDialog...

    Web弹出窗口对话框.pdf

    ***可以与JavaScript相结合,以实现Web页面上复杂的交互功能,包括创建弹出窗口对话框。 在使用JavaScript的window.open方法时,开发者可以指定打开新窗口的URL,以及窗口的特性,比如工具栏、地址栏、尺寸等。比如...

    javascript中showModalDialog子页面值赋给父页面

    在JavaScript编程中,`showModalDialog`是一个古老但仍然有用的函数,用于打开一个新的浏览器窗口或对话框,并与父页面进行交互。这个功能在处理用户输入、显示信息或进行特定操作时非常有用。在这个场景中,我们...

    showModalDialog参数传递和获

    在JavaScript中,`showModalDialog`是一个古老的浏览器API,用于打开一个模态对话窗口,它在用户与对话框交互之前阻止了对父窗口的访问。这个API在现代Web开发中已经逐渐被淘汰,但由于某些老旧系统的存在,理解其...

    Js 弹出框口并返回值的两种常用方法

    在JavaScript中,当需要在新窗口中执行代码并返回结果到当前页面时,通常采用window.showModalDialog()和window.open()这两种方法。以下详细解释这两种方法的用法和特点。 首先,window.showModalDialog()方法用于...

    showModalDialog打开窗体接收返回值

    在JavaScript编程中,`showModalDialog` 是一个古老但仍然被一些开发者使用的函数,用于以模态对话框的形式打开一个新的窗口。这个对话框会阻止用户与父窗口进行交互,直到对话框关闭。在这个过程中,我们可以传递...

    window.showModalDialog(javascript)

    - 模态对话框可能会对用户体验造成影响,因为它会阻塞用户的交互,因此在现代Web开发中,更倾向于使用非模态对话框或者自定义的弹出层来实现类似的交互效果。 总之,`window.showModalDialog()`是JavaScript中创建...

    showModalDialog参数使用详解

    例如,在子窗口中设置`window.returnValue`,然后在父窗口中通过`window.showModalDialog`的返回值来访问。 ```javascript // 子窗口设置返回值 window.returnValue = '用户输入的数据'; // 父窗口获取返回值 var ...

    JavaScript实现弹出子窗口并传值给父窗口

    在JavaScript中,弹出子窗口并传递值给父窗口是一个常见的需求,特别是在构建交互式的Web应用时。这个过程可以通过使用`window.open()`或`window.showModalDialog()`函数来实现。让我们详细了解一下这两个方法以及...

    js弹出一个新页面并获得弹出页面的值

    根据提供的文件信息,本文将详细解释如何使用JavaScript在父页面中弹出一个新的窗口,并从这个新弹出的窗口中获取数据。此技术常用于需要在当前页面与另一个页面之间进行数据交互的应用场景。 ### 一、理解弹窗原理...

    window.showModalDialog方法的使用

    在JavaScript编程中,`window.showModalDialog`是一个用于打开模态对话框的函数,它能够创建一个新的浏览器窗口或者在当前窗口内显示一个弹出层,阻止用户与父窗口的交互,直到用户关闭对话框为止。这个方法在创建...

    Window.ShowModalDialog使用手册

    这个方法在创建用户交互和自定义弹出窗口场景中非常有用。让我们深入探讨一下`Window.showModalDialog()`的详细用法和相关知识点。 首先,`showModalDialog()`方法的基本语法如下: ```javascript window....

    showModalDialog用法

    - `features`:可选参数,定义弹出窗口的一些属性,如大小、位置等。 #### 二、参数详解 1. **URL**:这是必须指定的参数,表示要打开的新窗口的地址或HTML文档的路径。 2. **Arguments**:这是一个可选参数,...

Global site tag (gtag.js) - Google Analytics