第9章 JSP页面设计常用技术.ppt

1、1,第9章JSP页面设计常用技术,2,9.1Applet,Applet为小应用程序，JavaApplet就是使用Java语言编写的一些小应用程序，它们可以直接嵌入到网页中，并能够产生特殊的效果。在JavaApplet中，可以实现图形绘制、字体和颜色的控制、动画和声音的插入、人机交互以及网络交流等功能。Applet提供了名为抽象窗口工具箱(AbstractWindowToolkit，AWT)的窗口环境开发工具。含有Apple网页的HTML文件代码中带有和标记，当支持Java的网络浏览器遇到这对标记时，就将下载相应的小应用程序代码并在本地计算机上执行该Applet。Applet由支持Java的网页

2、浏览器下载运行，也可以通过Java开发工具的appletviewer来运行。Applet程序离不开使用它的HTML文件，这个HTML文件中关于Applet的信息至少包含以下3点。1.字节码文件。这个文件名为编译后的Java文件，以.class为后缀。2.字节码文件的地址。3.在网页上显示Applet的方式。,3,【例9-1】在JSP页面上加载JavaApplet程序，在Applet显示区域中显示一幅图像，用来简单说明一下Applet在JSP中的应用方法。1.编写Applet程序编写Applet程序picture.java，用来显示图像和文字。代码如下：packagech8_1;importja

3、va.awt.*;importjava.applet.*;publicclasspictureextendsAppletpublicvoidpaint(Graphicsg)Imagepic=getImage(getCodeBase(),1.jpg);Fontfont=newFont(宋体,Font.BOLD,30);g.setFont(font);g.setColor(Color.blue);g.drawImage(pic,0,0,this);g.drawString(美丽的大学校园！,30,30);,4,2编写JSP程序编写AppletApp.jsp文件，用来加载JavaApplet程序。代

4、码如下：嵌入APPLET小程序,5,显示结果如下图所示：,6,3.代码实现分析Applet程序picture.java在该程序里，使用了getImage()方法得到要显示的图像，然后用setFont()方法设置了字体，setColor()设置了颜色，接着用drawImage()方法把图像画出来，最后还用drawString()写了一行文字。JSP程序AppletApp.jsp新建了JSP程序AppletApp.jsp，通过元素加载JavaApplet程序，设置type的属性为“applet”；code的属性为“ch8_1.picture.class”；height的属性为446，用来指定图像的

5、显示高度；width的属性为580，指定图像的显示宽度。,7,9.2文件上下传,9.2.1文件上传1.jspSmartUpload组件的下载文件上传功能的实现主要依赖于JavaBean组件jspSmartUpload，此组件可以直接在网上下载，压缩包的名字是jspSmartUpload.zip。下载后，用WinZip或WinRAR将其解压缩到Tomcat的webapps目录下。解压缩后，把webapps/jspSmartUpload目录下的子目录Web-inf名字改为大写的WEB-INF，这样一改jspSmartUpload类才能使用。因为Tomcat对文件名大小写敏感，它要求Web应用程序相

6、关的类所在目录为WEB-INF，且必须是大写。接着重新启动Tomcat，这样就可以在JSP文件中使用jspSmartUpload组件了。,8,2.编写JSP程序编写upload.htm文件，建立表单，用来选择要上传的文件；编写do_upload.jsp文件，实现文件的上传。把upload.htm和do_upload.jsp保存在webappsjspSmartUpload目录下。(1)upload.htm代码如9-1.TXT(2)do_upload.jsp代码如9-2.TXT先显示upload.htm文件，点击相对应的“浏览”按钮，选择要上传的文件，显示结果下图所示：,9,然后点击“上传它”按钮

7、，显示上传成功文件的相关信息，运行结果如下图所示：,10,(3)代码实现分析对于upload.htm文件的表单，method属性必须为“post”，enctype属性必须为“multipart/form-data”，否则上传不会成功。然后添加4个文件域，用于选择上传文件，即其type的属性为“FIFE”。对于do_upload.jsp文件，首先需要载入“com.jspsmart.upload.*”的Java组件包，然后新建一个SmartUpload对象su，进行初始化。SmartUpload还提供了一些上传限制的设定，如setMaxFileSize()，该方法可以限制每个上传文件的最大长度，为

8、字节为单位；setTotalMaxFileSize()可以限制总上传数据的长度，同样也是为字节为单位。,11,9.2.2文件下载上一案例上传文件后，webappsjspSmartUploadupload目录下已存在4个文件了，如下图所示：,12,编写download.htm文件，建立超链接，用来指向相应的下载文件处理程序。编写do_download.jsp文件，实现“123.doc”文件的下载。(1)download.htm代码如下：下载文件点击相应的链接下载123.doc,13,(2)do_download.jsp代码如下：,14,先显示运行download.htm文件，显示结果如下图所示。

9、,在页面上单击“123.doc”的超链接，出现“文件下载”对话框，显示结果如下图所示。,15,9.3图象自由运动,本节主要利用JavaScript实现图象在浏览器窗口的自由运动，当越出边界时，从任意位置返回窗口继续自由运动。1.编写HTML程序编写FreeMove.htm文件，实现图象的自由运动，实现代码如9-3.TXT，显示结果如下图所示。,16,2.代码实现分析(1)新建html文件，使用标记，编辑JavaScript函数。首先声明变量，赋初值。指定生成5张图片，即no=5，并且设定每40毫秒刷新一次，即speed=40，同时还声明了一组数组，存放图片运动的坐标值。(2)使用Math对象的

10、random()方法产生随机数，参与生成每张图片初始位置，从而实现真正的自由轨迹。针对不同的浏览器，分别给出确定图片运动的方法。(3)初始化5张图片设置图片运动的速度setTimeout(to_move(),speed);(5)在IE浏览器中由to_move()方法确定图片的运行轨迹。(6)在Netscape浏览器中由move()方法确定图片的运行轨迹。,17,9.4动态日历,本节主要介绍如何利用JavaBean实现一个能进行年、月查找的日历程序。1.编写JavaBean程序建立一个Bean程序CalendarBean.java。该Bean主要功能由getCalendar()方法实现，功能包括

11、设置当月的天数，判断大小月以及闰年的情况，以数组存储每月的号码及1号是星期几。实现代码如9-4.TXT2.编写JSP程序编写Date.jsp文件，在JSP页面中调用该JavaBean的方法，实现年、月的动态查找。实现代码如9-5.TXT,18,运行Date.jsp文件，显示结果如图所示。,图9-11显示结果,19,在图9-11页面上可以看出，该日历默认的日期是2006年1月，现在点击“月份“下拉列表框，选择“5月”，然后单击“提交”按钮，显示结果如图9-12所示。,图9-12显示结果,20,3代码实现分析(1)Bean程序CalendarBean.java调用了Calendar类的setYea

12、r()、setMonth()、get(Calendar.DAY_OF_WEEK)等方法，其中setYear()方法和setMonth()方法用于设置用户输入的年、月。编写成员函数getCalendar()实现主要功能，并输出日历。在该成员函数中定义一个Calendar类的对象“日历”，并将日历设置为year年month月1日，注意0表示一月，依次类推，11表示12月。(2)JSP程序Date.jsp设置userBean语句，id属性为“Calendar”，scope属性为“request”，class属性为“ch8_3.CalendarBean”。实现代码如下：,21,9.5邮件发送,本例子主

13、要介绍如何利用JavaMailAPI实现发送E-mail的功能。1.JavaMail和JAF的下载JavaMail是Sun发布的用来处理E-mail的API，但它目前还没有被加在标准的java开发工具包中，所以在使用前必须另外下载JavaMail文件。本例以JavaMail1.1.3为例，下载JavaMail1.1.3工具，然后解压缩javamail1_1_3.zip文件，并把mail.jar文件添加到C:j2sdk1.4.2jrelibext目录下。安装完JavaMail1.1.3后，再安装JavaBeansActivationFramework。,22,2.编写JSP程序编写Email.h

14、tm文件，用来实现邮件发送的功能。编写Error.jsp文件，用来处理邮件地址输入出错等情况。编写SendOk.jsp文件，当邮件发送成功后，用来显示收信人、发信人等相关信息。(1)Email.htm代码如9-6.TXT(2)EmailSend.jsp代码如9-7.TXT(3)Error.jsp代码如9-8.TXT(4)SendOk.jsp代码如9-9.TXT,23,运行Email.htm文件，显示结果如图9-13所示。,图9-13显示结果,24,在图9-13中，输入相应的信息，点击“发送”按钮后，将显示如图9-14所示。,图9-14显示结果,25,在图9-13所显示的页面上，如果忘记输入了收

15、件人的邮件地址，点击“发送”按钮后，将会出现如图9-15所示。,图9-15显示结果,26,在图9-13所显示的页面上，如果“收件人”、“发件人”和“抄送”对话框输入的邮件地址不正确，点击“发送”按钮后，都会出现错误信息。运行画面如图9-16所示。,图9-16显示结果,27,3代码实现分析(1)新建Email.htm文件，建立表单，设置action的属性为“EmailSend.jsp”，method的属性为“post”，然后添加4个单行文本框，1个多行文本域及2个按钮，实现邮件编辑界面。在Email.htm文件中用JavaScript实现了一个判断函数，即对收件人的内容进行判断，如果收件人的内容

16、为空，则收件人对应的单行文本框获得焦点，其中“to”为收件人对应的单行文本框的“name”。实现代码如下：FunctionchkForm(theForm)if(theForm.to.value=)alert(收件人地址不能为空);theForm.to.focus();return(false);,28,(2)编辑文件EmailSend.jsp，载入需要的java包，代码如下：然后使用request.getParameter()取得表单输入的数据，对含有汉字的主题和内容使用getBytes(ISO8859_1)进行转码处理。实现代码如下：Stringto=request.getParameter

17、(to);Stringfrom=request.getParameter(from);Stringcs=request.getParameter(cs);bytesubjectTemp=request.getParameter(subject).getBytes(ISO8859_1);Stringsubject=newString(subjectTemp);bytemessageTextTemp=request.getParameter(body).getBytes(ISO8859_1);StringmessageText=newString(messageTextTemp);,29,对输入邮件地址的有效性进行判断