WEB界面所看到的语言都存在数据库或资源文件中。本系统禁止一切在页面上和程序代码中有特定语言类型标识的文字存在。（注释除外）
HTML 数据绑定(Data Bind)技术的基本原理是页面中提供一个显示数据的数据源对象DSO（data source object),页面的元素通过绑定这个数据源得到数据。绝大多少HTML元素，甚至IE内置的一些ActiveX控件都提供了绑定的功能,包括 a, button, div, img, frame, iframe, label, marquee, span等标签 。关于数据源对象DSO,通常用到的有XML标签<XML></XML>。
XML 标签仅在IE5以上版本支持.其功能是在HTML页面上定义一个XML的数据岛（data island）
例如：
<XML ID="oMetaData">
<METADATA>
<AUTHOR>John Smith</AUTHOR>
<GENERATOR>Visual Notepad</GENERATOR>
<PAGETYPE>Reference</PAGETYPE>
<ABSTRACT>Specifies a data island</ABSTRACT>
</METADATA>
</XML>
XML 数据岛中的数据可以很方便的绑定。也可以很方便的用IE内置的一些ActiveXObject进行操作。下面主要介绍一下HTML的绑定。
绑定用到的两个属性是DATASRC和DATAFLD ,DATASRC 用于制定一个数据源。如：DATASRC="#oMetaData" oMetaData为DSO的ID.微软说ID前面必须加一个#,所以必须要加，要不让设置无效。
DATAFLD 这个地方要设置一个绑定的字段.如：DATAFLD = "AUTHOR"
<SPAN DATASRC="#oMetaData" DATAFLD = "AUTHOR"></SPAN> 这个在页面中显示的是John Smith
HTML表单元素支持的绑定略有不同。以下是一个演示的例子：
testbind.html
---------------------
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD>
<BODY>
<xml src=xx.xml id="kk"></xml>
<INPUT TYPE="text" NAME="fd" datasrc="#kk" datafld="crop">
<BR>
<INPUT TYPE="checkbox" NAME="aa" datasrc="#kk" datafld="check1" value=1>
<INPUT TYPE="checkbox" NAME="aa" datasrc="#kk" datafld="check2" value=2>
<INPUT TYPE="checkbox" NAME="aa" datasrc="#kk" datafld="check3" value=3>
<INPUT TYPE="checkbox" NAME="a" datasrc="#kk" datafld="check4" value=4>
<INPUT TYPE="checkbox" NAME="a" datasrc="#kk" datafld="check5" value=5>
<BR>
<INPUT TYPE="radio" NAME="b" datasrc="#kk" datafld="radio" value=1>
<INPUT TYPE="radio" NAME="b" datasrc="#kk" datafld="radio" value=2>
<INPUT TYPE="radio" NAME="b" datasrc="#kk" datafld="radio" value=3>
<INPUT TYPE="radio" NAME="b" datasrc="#kk" datafld="radio" value=4>
<INPUT TYPE="radio" NAME="b" datasrc="#kk" datafld="radio" value=5>
<INPUT TYPE="radio" NAME="b" datasrc="#kk" datafld="radio" value=6>
<INPUT TYPE="radio" NAME="b" datasrc="#kk" datafld="radio" value=7>
<BR>
<SELECT datasrc="#kk" datafld="select" >
<option value=1>S公司</option>
<option value=2>K公司</option>
<option value=3>L公司</option>
<option value=4>J公司</option>
<option value=5>B公司</option>
<option value=6>M公司</option>
</SELECT>
<BR>
<TEXTAREA NAME="" ROWS="5" COLS="20" datasrc="#kk" datafld="textarea"></TEXTAREA>
<BR><INPUT TYPE="reset" datasrc="#kk" datafld="reset" onclick="kk.src='xx2.xml'">
<INPUT TYPE="reset" datasrc="#kk" datafld="reset" onclick="kk.src='xx.xml'">
<div datasrc="#kk" datafld="div"></div>
</BODY>
</HTML>
---------------------
XML数据。
xx.xml
-----------------------
<?xml version="1.0" encoding="gb2312"?>
<root>
<row><crop>4</crop>
<name>xxxx</name>
<pass>yyyyy</pass>
<check1>true</check1>
<check2>false</check2>
<check3>true</check3>
<check4>false</check4>
<check5>true</check5>
<radio>3</radio>
<select>3</select>
<textarea>文本的内容</textarea>
<reset>绑定的按钮的值</reset>
<div>DIV内的值</div></row>
</root>
---------------------
XML数据。
xx2.xml
-----------------------
<?xml version="1.0" encoding="gb2312"?>
<root>
<crop>5</crop>
<name>yyyyyyyy</name>
<pass>bbbbb</pass>
<check1>false</check1>
<check2>false</check2>
<check3>true</check3>
<check4>false</check4>
<check5>true</check5>
<radio>5</radio>
<select>2</select>
<textarea>文本的内容222222</textarea>
<reset>绑定的按钮的值222222</reset>
<div>DIV内的值222222222</div>
</root>
大家实际操作一下就知道效果了。不再多说。
在本系统中，XML数据是通过每个页面的PAGEID，查询数据库取得一个XML数据流进行绑定的(/common/getPageLanguage.aspx)。原理上和以上例子是一样的。
演示例子下载：bind.rar
以上是HTML的数据绑定技术的初级应用，更多的查询微软的MSDN的资料。
参考文档：
http://msdn.microsoft.com/workshop/author/databind/dataconsumer.asp
|
本类阅读TOP10