`

模式窗口(dialog)

阅读更多

  在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" onclick="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="确认" onclick="closewindow()">
				</td>
			</tr>
		</table>
	</form>
  </body>
</html>

 

分享到:
评论

相关推荐

    vc模式窗口与非模式窗口的例子_知信行模式的例子

    在VC++编程中,窗口是用户界面的基础,分为两种主要类型:模式窗口(Modal Dialog)和非模式窗口(Modeless Dialog)。这两种窗口在应用程序中扮演着不同的角色,各有其特定的使用场景和特点。 首先,我们来理解...

    创建自定义对话框dialog,弹出模式窗口

    创建自定义对话框dialog,弹出模式窗口 用于创建自定义对话框的轻量级(约 4.5 KB)代码库。四种对话框可用: alerts(出错), warnings(警告), prompts(提示), success(成功)。利用一个简单的函数,你可以自定义对话框...

    pyqt5 多窗口调用-模式和非模式对话框显示

    在这个例子中,`dialog.exec_()`使得对话框成为一个模式窗口,用户必须点击“关闭”按钮才能返回主窗口。 2. 非模式对话框(MainWindow with show()) 主窗口(MainWindow)通常由`QMainWindow`类创建,使用`show...

    jquery 模式窗口

    本篇文章将详细讲解如何利用jQuery实现一个美观的“模式窗口”(Modal Window)并结合选项卡功能,为用户提供优秀的体验。 一、jQuery模式窗口(Modal Window) 模式窗口是一种在用户进行特定操作时弹出的覆盖整个...

    JS 弹出模式窗口 和 非模式窗口

    JavaScript中的弹出窗口是网页交互的一种常见方式,主要包括模式窗口(Modal Dialog)和非模式窗口(Modeless Dialog)。这两种窗口的主要区别在于它们如何与用户交互以及如何与其他窗口共存。 **模式窗口** 是一种...

    模式传递数值给非模式窗口

    标题"模式传递数值给非模式窗口"涉及到的是在模式对话框中获取用户输入,然后将这些数据传递给非模式对话框,以便在非模式对话框中显示或使用这些数值。这个过程通常包括以下几个步骤: 1. **创建模式对话框**: ...

    jquery 弹出模式窗口

    弹出模式窗口(Modal Dialog)是一种覆盖在网页主内容上的浮动窗口,通常用于获取用户输入、展示信息或执行某种操作。它们在页面上以半透明背景层和聚焦的对话框形式出现,确保用户必须先处理弹出窗口才能继续与页面...

    JQuery模式窗口及案例!

    JQuery模式窗口是一种在网页中实现弹出对话框的技术,它允许用户在不离开当前页面的情况下与特定内容交互。在Web开发中,模式窗口经常用于显示警告、确认对话框、表单输入或者其他需要用户注意力的场景。JQuery库...

    Model--模式窗口的使用

    因此,开发者通常会使用第三方库,如Bootstrap的Modal插件、jQuery UI的Dialog,或者是自定义的解决方案来创建更灵活、可定制化的模式窗口。 Bootstrap的Modal组件是一个非常流行的模式窗口实现,它提供了丰富的...

    ASP.NET中的模式窗口

    &lt;div id="dialog" title="模式窗口"&gt; 内容在这里... ``` 在JavaScript中初始化对话框: ```javascript $(function() { $("#dialog").dialog({ modal: true }); }); ``` 2. **Bootstrap Modal** ...

    qml 用item自定义dialog 对话框

    在Qt Quick中,`Dialog`是一个用于展示临时信息或进行用户交互的窗口,通常会有一个确定的关闭机制,如点击按钮或外部点击隐藏。`Dialog`组件不是QML标准库的一部分,但可以通过`Rectangle`或`Item`等基础元素模拟...

    Dialog下创建 MFC OpenGL子窗口

    这里我们将深入探讨如何在Dialog模式下创建一个MFC OpenGL子窗口,而不是使用SDI (Single Document Interface) 或 MDI (Multiple Document Interface)。 首先,我们需要理解MFC中的对话框。对话框是Windows应用程序...

    (web前端设计)artDialog模式窗口

    在网页交互中,模式窗口(Modal Dialog)是一种阻塞用户界面的元素,直到用户与该窗口进行交互并关闭它,才能继续操作主页面。这种设计可以确保用户不会在处理重要信息或任务时分心。 artDialog主要特点包括: 1. ...

    C#多线程之如何弹出一个模式窗口来显示进度条

    要创建一个模式窗口,我们需要一个对话框(Dialog)控件,如`Form`,设置其`ShowDialog()`方法使其以模态方式显示。模态窗口会阻止用户与父窗口或其他窗口进行交互,直到该窗口关闭。在这个窗口中,我们可以添加一个...

    Qt模式弹框不阻塞

    在Qt编程中,"Qt模式弹框不阻塞"是一个特定的设计模式,它允许开发者创建一个看似模态的对话框,但不会像传统模态对话框那样阻止用户与父窗口或其他窗口的交互。这种设计在某些场景下非常有用,比如在提供用户反馈或...

    底部弹出dialog

    在Android应用开发中,"底部弹出Dialog"是一种常见的用户界面设计模式,它通常用于显示临时的通知、选项或请求用户的确认。这种对话框通常从屏幕底部向上滑动出现,给人以现代、直观的交互体验。在本文中,我们将...

    一个使用模式窗口的例子

    ### 模式窗口的使用详解 #### 一、概述 模式窗口是网页设计中的一个重要概念,在用户交互过程中常被用来创建弹出对话框,确保用户完成特定操作后才能继续进行其他活动。本文将详细介绍模式窗口的基本概念、参数...

    jquery Dialog 弹出框 很漂亮 实用

    3. **多种模式**:Dialog 支持多种模式,如模态(modal)和非模态(non-modal)。模态对话框阻止用户与背景页面交互,直到关闭对话框;非模态则允许用户同时操作对话框和页面其他部分。 4. **拖动和大小调整**:...

    JQuery Dialog

    Dialog 模式 - **模态与非模态**:默认情况下,Dialog是模态的,阻止用户与页面其他部分交互。如果想创建非模态Dialog,可以设置`modal: false`。 - **拖动与缩放**:Dialog支持拖动和缩放功能,这些可以通过`...

    不随滚动条滚动的模式窗口

    在网页设计和开发中,"不随滚动条滚动的模式窗口"是一种常见的用户体验设计技术,它允许用户在当前页面上打开一个全屏或半屏的弹出窗口,而这个窗口不会随着页面的滚动条移动。这种效果常用于图片预览、表单填写、...

Global site tag (gtag.js) - Google Analytics