showModalDialog的简单使用

最新推荐文章于 2024-05-30 11:27:58 发布

qchery

最新推荐文章于 2024-05-30 11:27:58 发布

阅读量164

点赞数

分类专栏： web前端文章标签： javascript showModalDialog ViewUI

本文链接：https://blog.csdn.net/chinrui/article/details/88303407

版权

web前端专栏收录该内容

12 篇文章 0 订阅

订阅专栏

[size=medium][align=center][b]showModalDialog的简单使用[/b][/align][/size]
1、要通过另外一个网页输入结果的网页

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
		<title>Untitled Document</title>
	<script type="text/javascript">
		function viewData(cid ,cname) {
			//获取通过showModalDialog传过来的window对象
			var sdata = window.dialogArguments;

			//设置第一个页面的属性值
			sdata.document.getElementById("cid").value = cid;
			sdata.document.getElementById("cname").value = cname;

			//关闭Dialog窗口
			window.close();
		}
	</script>
	</head>
	<body>
		<table border="1">
			<tr>
				<td>操作</td>
				<td>客户ID</td>
				<td>客户名称</td>
			</tr>
			<tr>
				<td><button onclick="viewData('001','深圳华为')">选择</button></td>
				<td>001</td>
				<td>深圳华为</td>
			</tr>
			<tr>
				<td><button onclick="viewData('002','用友软件')">选择</button></td>
				<td>002</td>
				<td>用友软件</td>
			</tr>
		</table>
	</body>
</html>

2、存储另外一个网页的相关属性，在需要的时候输送给另外一个网页

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
		<title>Untitled Document</title>
	</head>
	<body>
		<form name="form1" action="test.htm" method="post">
			客户ID：<input type="text" name="cid" value="" id="cid"><br/>
			客户名称：<input type="text" name="cname" value="" id="cname"><br/>
			<input type="button" name="ok" value="请选择客户" onclick="openWin();">
		</form>
	</body>

	<script type="text/javascript">
		function openWin() {
			window.showModalDialog("msg.htm",window,"dialogHeight:200px;dialogWidth:200px;dialogLeft:350px;dialogTop:350px;center:yes;help:no;");
		}
	</script>
</html>

3、为了使两个页面更加的独立，在第二个页面调用第一个页面的一个函数
--第二个页面的javascript代码

<script type="text/javascript">
	function viewData(cid ,cname) {
		//获取通过showModalDialog传过来的window对象
		var sdata = window.dialogArguments;

		//设置第一个页面的属性值
//			sdata.document.getElementById("cid").value = cid;
//			sdata.document.getElementById("cname").value = cname;
//			调用第一个页面的函数
		sdata.setValue(cid,cname);

		//关闭Dialog窗口
		window.close();
	}
</script>

--第一个页面的javascript代码

<script type="text/javascript">
	function openWin() {
		window.showModalDialog("msg.htm",window,"dialogHeight:200px;dialogWidth:200px;dialogLeft:350px;dialogTop:350px;center:yes;help:no;");
	}

	function setValue(cid,cname) {
		document.getElementById("cid").value = cid;
		document.getElementById("cname").value = cname;
	}
</script>

qchery

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
showModalDialog的简单使用

ta(cid ,cname) { //获取通过showModalDialog传过来的window对象 var sdata = window.dialogArguments; //设置第一个页面的属性值 sdata.document.getElementById("cid").value = cid; sdata.document.getElementById("cname").value = cname;
复制链接

扫一扫