事件驱动的Web之旅——JSP与JavaScript的融合(续)
2004-04-23 13:26
465 查看
我们再来说一说JSP和JavaScript的搭配使用和相互访问。
也许你用过Delphi的WebBroker开发过Web Application当你每做的一件事(提交)就是一个WebAction,说白了,就是一个函数。而这个函数在ASP、JSP条件下就成了一个页面。不过你也应该把他们理解成函数,一个返回字符串的函数。而这个字符串,就是你在浏览器利用查看源文件菜单命令所看到的结果。这样,JavaScript调用Java变量的问题就迎刃而解了。我们的JSP返回的字符串有JavaScript代码,而这些代码是由浏览器解释执行的。由于JavaScript代码的生成都可以由JSP动态生成,所以,JavaScript中可以包含JSP代码的运行结果。这样就实现了JavaScript对JSP变量的调用。
下面我们再来看一看,JavaScript对JSP方法和JSP对JavaScript的调用。这两个调用都有一个共同点,那就是需要对页面进行提交,在用Hidden设置几个隐藏参数。JSP根据获得的参数再进行相应的处理,就可以了。也许有的人已经不太明白了,那我们还是用一个程序来说明问题吧!
程序二:一个服务器获得客户端信息的Web页面。他获得了客户端的一些屏幕设置,并把它们记录在数据库里。
GetClientInfo.jsp
这个Web运行时,首先用JavaScript获得客户端的信息,然后自动提交页面,提交后JSP会记录相应信息,并保存在数据库里,然后再把所有的访问者的情况从数据库里读出来显示。在这个程序里还调用了MSAgent他所显示的文字全都是JSP的变量,当然你也可以设置成别的。
本程序还用到了数据库,是Accsess,一个放于 %YOURAPP%/WEB-INF/msg.mdb的文件。里面有一个表ClientMsg。有几个字段:
好的例子一个足已!
也许你会说,不就是提交么?
对,下一次我们讲的就是 提交的艺术。
(运行环境 IE6、TOMCAT4.1.x JDK1.4.x)
也许你用过Delphi的WebBroker开发过Web Application当你每做的一件事(提交)就是一个WebAction,说白了,就是一个函数。而这个函数在ASP、JSP条件下就成了一个页面。不过你也应该把他们理解成函数,一个返回字符串的函数。而这个字符串,就是你在浏览器利用查看源文件菜单命令所看到的结果。这样,JavaScript调用Java变量的问题就迎刃而解了。我们的JSP返回的字符串有JavaScript代码,而这些代码是由浏览器解释执行的。由于JavaScript代码的生成都可以由JSP动态生成,所以,JavaScript中可以包含JSP代码的运行结果。这样就实现了JavaScript对JSP变量的调用。
下面我们再来看一看,JavaScript对JSP方法和JSP对JavaScript的调用。这两个调用都有一个共同点,那就是需要对页面进行提交,在用Hidden设置几个隐藏参数。JSP根据获得的参数再进行相应的处理,就可以了。也许有的人已经不太明白了,那我们还是用一个程序来说明问题吧!
程序二:一个服务器获得客户端信息的Web页面。他获得了客户端的一些屏幕设置,并把它们记录在数据库里。
GetClientInfo.jsp
<%@ page contentType="text/html; charset=utf-8" language="java" %> <%@ import="java.sql.*" %> <HTML> <HEAD> <TITLE>Information</TITLE> <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=utf-8"> <STYLE TYPE="text/css"> TABLE, BODY { font-family: "Courier New"; font-size: 10pt; } </STYLE> </HEAD> <BODY> <% if(request.getParameter("isHaveData") == null){ %> <FORM NAME="frmClient" METHOD="POST"> <INPUT TYPE="HIDDEN" NAME="isHaveData" VALUE=""> <INPUT TYPE="HIDDEN" NAME="iScreenWidth"> <INPUT TYPE="HIDDEN" NAME="iColorDepth"> <INPUT TYPE="HIDDEN" NAME="iScreenHeight"> <INPUT TYPE="HIDDEN" NAME="sBrowseName"> <INPUT TYPE="HIDDEN" NAME="sBrowseVer"> <INPUT TYPE="HIDDEN" NAME="iClientHeight"> <INPUT TYPE="HIDDEN" NAME="iClientWidth"> <SCRIPT language="JavaScript1.4" TYPE="TEXT/JAVASCRIPT"> frmClient.iScreenWidth.value = screen.width; frmClient.iScreenHeight.value = screen.height; frmClient.iColorDepth.value = screen.colorDepth; frmClient.sBrowseName.value = navigator.appName; frmClient.sBrowseVer.value = navigator.appVersion; frmClient.iClientHeight.value = screen.availHeight; frmClient.iClientWidth.value = screen.availWidth; frmClient.submit(); </SCRIPT> </FORM> <% } else { %> <OBJECT id=objMSAgent classid=CLSID:D45FD31B-5C6E-11D1-9EC1-00C04FD7081F width="32" height="32"> </OBJECT> <SCRIPT language="JavaScript1.4" TYPE="TEXT/JAVASCRIPT"> var MerlinID; var MerlinACS; objMSAgent.Connected = true; MerlinLoaded = LoadLocalAgent(MerlinID, MerlinACS); Merlin = objMSAgent.Characters.Character(MerlinID); Merlin.Show(); Merlin.Play("Surprised"); Merlin.Speak("<%= "Hello?" %>"); Merlin.Play("GestureLeft"); Merlin.Think("<%= "This is a jsp variant" %>"); Merlin.Play("Pleased"); Merlin.Think("<%= "JavaScript uses jsp variants" %>"); Merlin.Play("GestureDown"); Merlin.Speak("<%= "Bye! so Easy!" %>"); Merlin.Hide(); function LoadLocalAgent(CharID, CharACS) { LoadReq = objMSAgent.Characters.Load(CharID, CharACS); return(true); } </SCRIPT> <TABLE> <TR><TD COLSPAN="2"> <FONT COLOR="#FF0000">your infomation:</FONT> </TD></TR> <TR><TD>Screen Width:</TD> <TD><%= request.getParameter("iScreenWidth") %></TD></TR> <TR><TD>Screen Height:</TD> <TD><%= request.getParameter("iScreenHeight") %></TD></TR> <TR><TD>Color Depth:</TD> <TD><%= request.getParameter("iColorDepth") %></TD></TR> <TR><TD>Browse Name:</TD> <TD><%= request.getParameter("sBrowseName") %></TD></TR> <TR><TD>Browse Version:</TD> <TD><%= request.getParameter("sBrowseVer") %></TD></TR> <TR><TD>Client area Width:</TD> <TD><%= request.getParameter("iClientWidth") %></TD></TR> <TR><TD>Client area Height:</TD> <TD><%= request.getParameter("iClientHeight") %></TD></TR> </TABLE> <% String strDSN = "jdbc:odbc:driver={Microsoft Access Driver (*.mdb)};DBQ=" + application.getRealPath("//WEB-INF//msg.mdb"); Connection cnct = null; Statement stmt = null; Class.forName("sun.jdbc.odbc.JdbcOdbcDriver"); cnct = DriverManager.getConnection(strDSN,"",""); stmt = cnct.createStatement( ResultSet.TYPE_SCROLL_INSENSITIVE, ResultSet.CONCUR_UPDATABLE); java.text.DateFormat dfNow = java.text.DateFormat.getDateTimeInstance( java.text.DateFormat.MEDIUM, java.text.DateFormat.MEDIUM); String strDate = dfNow.format(new java.util.Date()); String sInsertSQL = "INSERT INTO ClientMsg VALUES(" + "/'" + request.getRemoteAddr() + "/'," + "/'" + strDate +"/'," + "/'" + request.getParameter("iScreenWidth") + "/'," + "/'" + request.getParameter("iScreenHeight") + "/'," + "/'" + request.getParameter("iColorDepth") + "/'," + "/'" + request.getParameter("sBrowseName") + "/'," + "/'" + request.getParameter("sBrowseVer") + "/'," + "/'" + request.getParameter("iClientWidth") + "/'," + "/'" + request.getParameter("iClientHeight") + "/');"; stmt.executeUpdate(sInsertSQL); %> <P><FONT COLOR="#FF0000"> The information of other visitors:</FONT></P> <% ResultSet RS = stmt.executeQuery("SELECT * FROM ClientMsg"); while(RS.next()){ %> <TABLE> <TR><TD COLSPAN="2"><HR SIZE="1"></TD></TR> <TR><TD COLSPAN="2"><STRONG> <FONT COLOR="#0000FF"><%=RS.getString("IP")%> at <%=RS.getString("Time")%> visited this Page </FONT></STRONG></TD></TR> <TR><TD>Screen Width:</TD> <TD><%= RS.getString("ScreenWidth") %></TD></TR> <TR><TD>Screen Height:</TD> <TD><%= RS.getString("ScreenHeight") %></TD></TR> <TR><TD>Color Depth:</TD> <TD><%= RS.getString("ColorDepth") %></TD></TR> <TR><TD>Browse Name:</TD> <TD><%= RS.getString("BrowseName") %></TD></TR> <TR><TD>Browse Version:</TD> <TD><%= RS.getString("BrowseVer") %></TD></TR> <TR><TD>Client area Width:</TD> <TD><%= RS.getString("ClientWidth") %></TD></TR> <TR><TD>Client area Height:</TD> <TD><%= RS.getString("ClientHeight") %></TD></TR> </TABLE> <% } RS.close(); RS = null; stmt.close(); cnct.close(); stmt = null; cnct = null; } %> <BR> </BODY> </HTML> |
本程序还用到了数据库,是Accsess,一个放于 %YOURAPP%/WEB-INF/msg.mdb的文件。里面有一个表ClientMsg。有几个字段:
好的例子一个足已!
也许你会说,不就是提交么?
对,下一次我们讲的就是 提交的艺术。
(运行环境 IE6、TOMCAT4.1.x JDK1.4.x)
相关文章推荐
- 事件驱动的Web之旅——JSP与JavaScript的融合
- 服务器端 js 利用JavaScript开发事件驱动的Web应用 – node.js简介
- 利用JavaScript开发事件驱动的Web应用 – node.js简介
- 事件驱动的Web之旅——JSP与JavaScript的融合
- 【JavaWeb】JavaScript_事件编程
- Android:如何在java代码中覆盖webview中的javascript事件
- javascript移动设备Web开发中对touch事件的封装实例
- 关于myeclipse10.0 的jsp中某个标签中 javascript (代码正常)事件的错误提示。
- Javascript驱动事件
- Nginx 之三:nginx服务器模块、web请求处理机制及事件驱动模型、进程功能和进程间通信
- 跨浏览器的事件处理方法(Professional JavaScript for Web Developers)
- javascript之DOM事件驱动编程
- Java web-w1:java web、jsp、JavaScript之间的区别
- 深入理解javaScript中的事件驱动
- 在做j2ee的web项目,前端研发的时候,在写html、jsp、JavaScript代码的时候,卡壳了,特别是JavaScript,f12,没有解决不了的问题
- 跨浏览器的事件处理方法(Professional JavaScript for Web Developers)
- 韩顺平 javascript教学视频_学习笔记22_js事件驱动机制_js事件分类_js访问css技术
- 基于管道化和事件驱动模型的Web请求处理(一)
- 29-JavaScript-事件-事件驱动-更改外部css属性-区分浏览器内核