我们先来看一下它的几个实例:
(1) 打开网页:

(2) 显示一组图片:

基本使用
(1) 进入官网,点击下载

(2) 解压。(其中的 installation.html 对其使用进行了说明,很简单,一看就明白。我还是写一下步骤吧)
(3) 将其中的 greybox 文件夹拷贝到 web 项目根目录下,注意:一定要放在 web 根目录下,放在其他目录或二级目下肯能不能使用,在我的工程里是这么部署的:

(顺便说下教训,一开始我将其放在了 js 文件夹下,因为我的 js 脚本都在里面放的,jQuery 也在,可就是不能用。。。最后放在了 根目录下就可以使用了。)
(4) 现在就可以使用了,我们用一个测试页来进行测试,代码如下:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>test.html</title>
<!-- GreyBox引用开始 -->
<script type="text/javascript">
var GB_ROOT_DIR = "./greybox/"; //注意这里的路径!!!
</script>
<script type="text/javascript" src="greybox/AJS.js"></script>
<script type="text/javascript" src="greybox/AJS_fx.js"></script>
<script type="text/javascript" src="greybox/gb_scripts.js"></script>
<link href="greybox/gb_styles.css" rel="stylesheet" type="text/css" />
<!-- GreyBox引用结束 -->
</head>
<body>
<a href="http://www.baidu.com" title="百度" rel="gb_page[500, 500]">百度一下</a>
</body>
</html>
这样就完成了基本的使用。
但是,在实际开发中,我们需要实现这样的效果:(1) 通过点击 button 来弹出模式窗口;(2) 关闭模式窗口后,刷新父窗口。
通过基本使用,我们可以看到官网的示例都是在点击一个超链接后弹出模态对话框。


等等。
但对于实际开发,我们有时需要实现通过点击 Button 来弹出一个模态对话框。其实,稍作修改就可以实现了,由于前篇文章已经对使用做了说明,这次就直接上代码了:
(1) 实现按钮点击弹出模态对话框
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>test.html</title>
<!-- GreyBox引用开始 -->
<script type="text/javascript">
var GB_ROOT_DIR = "./greybox/"; //注意这里的路径!!!
</script>
<script type="text/javascript" src="greybox/AJS.js"></script>
<script type="text/javascript" src="greybox/AJS_fx.js"></script>
<script type="text/javascript" src="greybox/gb_scripts.js"></script>
<link href="greybox/gb_styles.css" rel="stylesheet" type="text/css" />
<!-- GreyBox引用结束 -->
<script type="text/javascript">
//居中弹出模态窗口
function openWinCenter() {
//GB_showCenter(caption, url, /* optional */ height, width, callback_fn)
GB_showCenter("百度一下", "http://www.baidu.com", 600, 900);
}
//全屏弹出模态窗口
function openWinFull() {
//GB_showFullScreen(caption, url, callback_fn)
GB_showFullScreen("百度一下", "http://www.baidu.com");
}
</script>
</head>
<body>
<input type="button" value="居中弹出" onclick="openWinCenter()"><br/>
<input type="button" value="全屏弹出" onclick="openWinFull()"><br/>
</body>
</html>
具体用法可以看官方文档的“Advance Usage”部分。
(2) 开发过程中还会遇到这样的问题,在弹出窗口进行操作后,关闭时需要对父窗口进行刷新。怎么实现?
我们先看一下普通的 js 是怎么写的
<script language="javascript">
//弹出窗口
function openSubWin() {
window.open("","name1","width=100,height=200,toolbar=no,scrollbars=no,menubar=no,screenX=100,screenY=100");
}
//关闭子窗口,刷新父窗口
function closeSubWin() {
window.opener.location = "http://www.baidu.com";
window.close();
}
</script>
那如果使用 GreyBox 怎么实现呢?上代码,【注意】这个 js 是在子窗口的网页中写的:
<script type="text/javascript">
function close() {
parent.parent.location.reload();
parent.parent.GB_hide();
}
</script>
好了,至此就完成了对于 GreyBox 的学习,这些基本就可以满足我们日常的项目需要了。
<!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=gb2312" />
<title>无标题文档</title>
<script src="http://www.cnblogs.com/syuhai/admin/file:///E:/Documents and Settings/Administrator/桌面/js/js/jquery/jquery-1.3.2-vsdoc2.js" type="text/javascript"></script>
</head>
<body>
<script type="text/javascript">
$(document).ready(function(){
$("#search-1").click(function(){
var k = $("#txtSelect").val();
var key=$("#txtKey").val();
var href="http://www.gyzs.net/search.aspx?t="+k+"&k="+key;
window.open( href, "_blank");
})
})
</script>
<div class="righttest">
<div class="l">
<select id="txtSelect">
<option selected="selected" value="1">产品</option>
<option value="0">厂家</option>
</select></div>
<div class="l ipt">
<input type="text" id="txtKey"></div>
<div class="l sub">
<input type="submit" value=" " id="search-1" style="cursor:pointer" ></div>
</div>
</div>
</body>
</html>
获取一组radio被选中项的值
var item = $('input[@name=items][@checked]').val();
select下拉框的第二个元素为当前选中值
$('#select_id')[0].selectedIndex = 1;
radio单选组的第二个元素为当前选中值
$('input[@name=items]').get(1).checked = true;
获取值:
文本框,文本区域:$("#txt").attr("value");
多选框checkbox:$("#checkbox_id").attr("value");
单选组radio: $("input[@type=radio][@checked]").val();
下拉框select: $('#sel').val();
控制表单元素:
文本框,文本区域:$("#txt").attr("value",'');//清空内容
$("#txt").attr("value",'11');//填充内容
多选框checkbox: $("#chk1").attr("checked",'');//不打勾
$("#chk2").attr("checked",true);//打勾
if($("#chk1").attr('checked')==undefined) //判断是否已经打勾
单选组radio: $("input[@type=radio]").attr("checked",'2');//设置value=2的项目为当前选中项
下拉框select: $("#sel").attr("value",'-sel3');//设置value=-sel3的项目为当前选中项
$("<option value='1'>1111</option><option value='2'>2222</option>").appendTo("#sel")//添加下拉框的option
$("#sel").empty();//清空下拉框
function bh_LoadViewState(){
var v=$("#hBirthday").val();
if(v=="")return;
var birthday=new Date(Date.parse(v.replace(/-/g, '/')))
$("#ddlYear").val(birthday.getFullYear());
$("#ddlMonth").val(birthday.getMonth()+1);
bh_setDayCount();
$("#ddlDay").val(birthday.getDate());
}
各种.Net平台开发语言开发数据库应用程序,一般并不直接对数据库操作(直接在程序中调用存储过程等除外),而是先完成数据连接和通过数据适配器填充DataSet对象,然后客户端再通过读取DataSet来获得需要的数据,同样更新数据库中数据,也是首先更新DataSet,然后再通过DataSet来更新数据库中对应的数据的。可见了解、掌握ADO.NET,首先必须了解、掌握DataSet。DataSet主要有三个特性:
1. 独立性。DataSet独立于各种数据源。微软公司在推出DataSet时就考虑到各种数据源的多样性、复杂性。在.Net中,无论什么类型数据源,它都会提供一致的关系编程模型,而这就是DataSet。
2. 离线(断开)和连接。DataSet既可以以离线方式,也可以以实时连接来操作数据库中的数据。这一点有点像ADO中的RecordSet。
3. DataSet对象是一个可以用XML形式表示的数据视图,是一种数据关系视图。
Dataset的一些操作
Dataset da= new Dataset();
da.Tables[0].Rows[i].ItemArray : 获得dataset 第 i 行的集合;
da.Tables[0].Rows[i][j]: 获得dataset 第 i 行第 j 列的值;
列子:
object[] aa = da.Tables[0].Rows[0].ItemArray;
string aa=da.Tables[0].Rows[1][2].ToString();
for (int i = 0; i < da.Tables[0].Rows.Count; i++) //表第三列重新赋值;
{
string aa=da.Tables[0].Rows[i][2].ToString();
ds.Tables[0].Rows[i][2] = SubStr(aa,20);
}

