| 信息技术教学网站作品评价页的技术实现
在信息技术课堂中，我们经常设计制作辅助教学用的网站，除了放置静态的教学资料外，如果能把学生提交的作品实时在网页中呈现出来，让所有访问的学生都能看到，无疑会对学生有更大的吸引力，也方便教师设计组织教学评价环节。
这里，给大家介绍我上学期参加广州市高中信息技术教学公开课比赛时用的教学评价网页所采用的技术，欢迎提宝贵的建议，也希望对大家有用。
首先，给大家交代一下网站运行环境。当然需要服务器支持，服务器端须有IIS网页服务和ftp文件传输服务，ftp可以使用FTPserver.exe这个软件，它无需安装，运行即可，特别适合异地公开课。另外需要数据库的支持，这里用的是微软的access数据库，win2003系统无须额外设置。
再说明一下我的评价页的实现流程。这节课是photoshop的学习，学生提交的是图片作品。我先把网站数据库写好，用了两个字段，id（序号，对应学生的学号或座位号 )和images（图片路径，先定后图片的上传路径和图片文件命名），数据库不做写入操作，只做读取。学生完成作品后，用要求的文件命名规则命名图片作品，如1号学生的作品命名为“1.jpg”，然后，学生访问ftp上传即可。ftp需要事先设置好位置，与数据库的记录路径一致，如我的数据库images字段中1号的记录为“zp/1.jpg”,那么网站需要一个叫做“zp”的文件夹，并将ftp设置路径要指向该文件夹。这样，当学生提交作品后网页就能正确的显示出来。
好了，下面就来看看我的评价页的代码实现，该页面需要使用动态页面，这里使用asp技术，可以用dreamweaver软件。
一、在所有页面代码之前，写入如下代码，主要是访问数据库，数据库文件“images.mdb”，放在网站根目录，“rs.PageSize=12”设置分页显示，每页12条记录。
<%
set conn=server.createobject("adodb.connection")
connstr="provider=Microsoft.Jet.OLEDB.4.0;Data Source=" & Server.MapPath("images.mdb")
conn.Open connstr
exec="select * from images"
set rs=server.createobject("adodb.recordset")
rs.open exec,conn,1,1
rs.PageSize=12
pagecount=rs.PageCount
page=int(request.QueryString ("page"))
if page<=0 then page=1
if request.QueryString("page")="" then
page=1
end if
rs.AbsolutePage=page
%>
二、网页的正常制作，也就是常规代码，网页的logo、链接等照常制作。好了，我计划将作品显示在中间，先用一个定了宽度的表格（当然你可以使用div技术），算好每个作品显示的宽度，计划好每行显示的个数。在单元格写入下面代码：
<td>
<%
for i=1 to rs.PageSize
%>
<%
if rs.EOF then
exit for
end if
%>
<table width="300" border="0" align="left" cellpadding="0" cellspacing="0" background="/images/background02.jpg" bgcolor="#11233A" class="table_float_left">
<tr>
<td height="30" align="left" valign="bottom" background="/images/background02.jpg" bgcolor="FAF6E7"> 编号：<%=rs("id")%></td>
</tr>
<tr>
<td align="left" background="/images/background02.jpg" bgcolor="FAF6E7"><a href="<%=rs("images")%>" target="_blank"><img src="<%=rs("images")%>" alt="你还没有提交作品或者是因为格式、作品命名不对" width="280" height="200" class="imageborder" /></a></td>
</tr>
</table>
<%
rs.movenext
next
%>
</td>
这段代码循环生成一个两行一列的表格，这里我使用“生成”这个字眼，意思是表格动态地生成出来，直到记录的末端（数据库准备了60个记录，共可以生成5个页面）。每个生成的表格第一行是编号，“编号：<%=rs("id")%>”，编号按数据库记录顺序列出。第二行，将数据库的路径记录读取出来，将学生作品呈现，<img src="<%=rs("images")%>" alt="你还没有提交作品或者是因为格式、作品命名不对" width="280" height="200" class="imageborder" />，这里宽280，高200，是根据表格宽度计算出来的。够简单吧，有兴趣，看看我的网站页面代码，本博客中有网站压缩包。
三、还有一点也非常重要，上段代码中，使用了一个样式 class="table_float_left"，如果不用这个样式，会发现12个表格一字排开将你的表格撑开，而不会像我的每四个自动分行，这个我就不说了，看看我的样式表设置，提醒你一点，我使用了左浮动样式。
好了，本篇到此，后见。 |
