注意,此页面附加了所有从服务器读取的字符串。要证明当前页面使用了 Ajax,单击页面的重新加载按钮,您会发现所有字符串都从页面中删除了。
恭喜!您已创建了第一个 Ajax 程序!
增强 Ajax 应用程序
以下练习构建在上一个示例的基础上,并用 Http Servlet 替换了 helloAjax.txt 文件。由于 servlet 可以包含逻辑,能够基于预先的定义修改响应格式,因此 servlet 比文件更具动态性,您可以使用 CSS 样式表为返回的数据行设置交变颜色,并显示页面用户键入的文本。
div.message b.red
{
background-color:gray;
color:RED;
font-family:Arial, Helvetica, sans-serif;
}
div.message b.green
{
background-color:yellow;
color:GREEN;
font-family:Arial, Helvetica, sans-serif;
}
div.message b.red 标记显示所有 <b> 元素时使用灰色背景颜色和红色字体颜色。<b> 元素有一个类属性 "red",并作为子元素嵌入具有一个 message 类属性的 HTML <DIV> 元素中。<DIV> 和 <b> HTML 元素作为返回给异步 Ajax 请求的服务器请求的一部分动态创建。
要创建 Http Servlet,从 JDeveloper 上下文菜单中选择 New,然后选择 Web Tier > Servlets 条目。从可选项中选择 HTTP Servlet。将 servlet 类命名为 HelloAjax,保留所有其他域和对话框的默认值。此操作将创建一个 Http Servlet 并将其映射为 web.xml 部署描述符中的 /helloajax 名。
private int counter = 0; private String name="";
添加到 servlet 中,且正好位于 private static final String CONTENT_TYPE = "text/html; charset=Windows-1252"; 域中。
public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException
{
counter;
name = request.getParameter("name") != null?(String)request.getParameter("name"):null;
//init cap
name="From " name;
response.setContentType(CONTENT_TYPE);
PrintWriter out = response.getWriter();
if(counter % 2 == 0)
{
out.println("<b class='green'>Hello Ajax " name " </b><br");
}
else
{
out.println("<b class='red'>Hello Ajax " name " </b><br");
}
out.close();
}
Servlet 期待包含用户输入的请求参数 "name",并将该参数添加到 Hello Ajax 消息中。每个偶数行都用 CSS 类引用 ‘green’ 显示,每个非偶数行都用 CSS 类引用 ‘red’ 显示。由于 XmlHttpRequest 输出显示在 <DIV></DIV> 元素对之间,因此为输出设置颜色的样式表将 <b> 元素表现为 div b.green 或 div b.red。稍后,您会为 HTML DIV 元素添加 class="message" 属性,因此产生的 CSS 引用为 div.message b.red 和 div.message b.green,这些是您先前在 helloAjax.css 文件中定义的 CSS 名称。.
将 HTML <body> 的内容从
<body> <input type="button" value="Press Me" onclick="doTheAjaxThing();" <div id="message"></div> </body>文章整理:西部数码--专业提供域名注册、虚拟主机服务
http://www.west263.com
以上信息与文章正文是不可分割的一部分,如果您要转载本文章,请保留以上信息,谢谢!




