模式窗口(dialog)

最新推荐文章于 2020-06-16 22:42:55 发布

iteye_13098

最新推荐文章于 2020-06-16 22:42:55 发布

阅读量250

点赞数

分类专栏：前端文章标签： dialog

本文链接：https://blog.csdn.net/iteye_13098/article/details/82486864

版权

前端专栏收录该内容

35 篇文章 0 订阅

订阅专栏

在web开发，有些时候需要再另一个页面处理数据然后将处理的结果返回个打开处理页面的页面。。。。。。，这时候我问需要用到模式窗口及(dialog)。

例如：在“father.jsp”页面点击弹出“moShi.jsp”页面，让后将“moShi.jsp”里表当数据的值返回到“father.jsp”页面

一、father.jsp

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<html>
	<head>
		<title>Insert title here</title>
		<script type="text/javascript" src="../js/jquery/jquery.js"></script>
		<script type="text/javascript">
			function openwindow(){
		    	var address = window.showModalDialog("moShi.jsp","","dialogWidth=340px;dialogHeight=270px");
		    	document.myform.address.value=address;
			}
			
			function showinfo(){
				var address=document.myform.address.value;
				var flage=confirm("您本次购买的商品信息如下：\n商品名称：跑跑游戏道具；\n商品数量：5件；\n商品单价：12.5美金；\n运费：10美金；\n费用总计：72.5美金；\n送货地址:"+address+"\n请确认以上信息是否有误！！！");
				if(flage){
					alert("您的订单已提交");
				}
			}
    	</script>
	</head>
	<body>
		<form action="" method="post" name="myform">
			<table width="533" height="133" border="1" bgcolor="#ffc8c8"
				align="center" cellpadding="0" cellspacing="0">
				<tr>
					<th colspan="5">简易购物车</th>
				</tr>
				<tr align="center">
					<td width="92">商品名称</td>
					<td width="100">数量(件)</td>
					<td width="110">单价(美元)</td>
					<td width="101">运费(美元)</td>
					<td width="130">合计</td>
				</tr>
				<tr align="center">
					<td>跑跑道具</td>
					<td>5</td>
					<td>12.5</td>
					<td>10</td>
					<td>72.5美元</td>
				</tr>
				<tr align="center">
					<td colspan="5">
						<a href="javascript:openwindow()">填写你的邮寄地址</a>
						<input name="address" type="text" size="40" disabled /> &nbsp;
						<input name="sub" οnclick="showinfo()" type="button" value="提交定单" />
					</td>
				</tr>
			</table>
		</form>
	</body>
</html>

二、moShi.jsp

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<html>
  <head> 
    <script type="text/javascript">
	   function closewindow(){
			var province=document.myform.province.value;
			var city=document.myform.city.value;
			var district=document.myform.district.value;
			var number=document.myform.number.value;
			var street=document.myform.street.value;
			if(province==city){
				window.returnValue=city+district+street+number;
			}else{
				window.returnValue=province+city+district+street+number;
			}
			window.close();
		}
    </script>
  </head>
  
  <body>
    <form action="" name="myform" method="post">
		<table width="290" height="206" align="center" border="0"
			bgcolor="#ffc8c8" cellpadding="0" cellspacing="0">
			<tr>
				<td colspan="2" align="center">
					<span class="style1">送货地址确认</span>
				</td>
			</tr>
			<tr>
				<td width="124" align="right" valign="middle">
					省份：
				</td>
				<td width="166">
					<select name="province">
						<option value="北京市">北京市</option>
						<option value="广东省">广东省</option>
						<option value="河北省">河北省</option>
						<option value="四川省">四川省</option>
						<option value="江苏省">江苏省</option>
					</select>
				</td>
			</tr>
			<tr>
				<td align="right" valign="middle">城市：</td>
				<td>
					<select name="city">
						<option value="北京市" selected>北京市</option>
						<option value="上海市">上海市</option>
						<option value="广州市">广州市</option>
						<option value="邯郸市">邯郸市</option>
						<option value="峨眉山市">峨眉山市</option>
					</select>
				</td>
			</tr>
			<tr>
				<td align="right" valign="middle">区：</td>
				<td>
					<select name="district">
						<option value="西城区">西城区</option>
						<option value="海淀区">海淀区</option>
						<option value="白云区">白云区</option>
						<option value="解放区">解放区</option>
						<option value="进城区">进城区</option>
					</select>
				</td>
			</tr>
			<tr>
				<td align="right" valign="middle">街道：</td>
				<td><input name="street" type="text" size="20"></td>
			</tr>
			<tr>
				<td align="right" valign="middle">门牌号：</td>
				<td><input name="number" type="text" size="20"></td>
			</tr>
			<tr>
				<td colspan="2" align="center">
					<input name="btn" type="button" value="确认" οnclick="closewindow()">
				</td>
			</tr>
		</table>
	</form>
  </body>
</html>