用JSP定制标签创建丰富的超连接

      JAVA世界 2004-7-14 17:22
by Amit Goel
04/30/2003
――翻译作者:-matrix开源技术-JAVAMEN

当今由HTML支持的连接机制(<a href="destination.html">)允许创建有唯一地址的
超连接,为了能在超连接上增加上下文相联系的地址,我们需要提供一些嵌入语(比如:
"download PDF version," "download Word version,"等等)或者使其跳转到页面的另一部分(比
如:a "Resources"),有时候会导使读者找不到上下文。如果我们把这些附加的地址潜入到
一个超连接里,就可以极大的提高页面的使用价值。这些嵌入的连接可以指向另外一些资源,
以使我们在同一区域聚集更多需要的信息。
为了能在一个超连接里嵌入一些连接,或许你可能会采用以下方式:
<a href="main_destination.html"
href1="embedded_destination1.html" text1="embedded hypertext1"
href2="embedded_destination2.html" text2="embedded hypertext2"
href3="embedded_destination3.html" text3="embedded hypertext3"
href4="embedded_destination4.html" text4="embedded hypertext4">main hypertext
</a>
或者以标签嵌套的方式,比如:
<a href="main_destination.html">main hypertext
<a href="embedded_destination1.html">embedded hypertext1</a>
<a href="embedded_destination2.html">embedded hypertext2</a>
<a href="embedded_destination3.html">embedded hypertext3</a>
<a href="embedded_destination4.html">embedded hypertext4</a>
</a>

很不幸的是以这种方式根本不能达到要求也不符合HTML规范,如果这样的话会使得
头连接忽略附加的那些连接并且把这些连接罗列出来
大家都知道,使得用户能接受一些新功能的关键是在于它的可用性。因此,任何扩展连
接的方法都不是行之有效的,而应该采用一种类似于导航条的机制以使用户能轻而易举的理解和接受它。我们可以把一个下拉式的图标安置在超连接旁边,点击该图标就会显示那些嵌入的超连接。正如下图所示:
www.matrix.org.cn/upload/forum/2003829232726.gif
其实这就是我们所熟悉的动态菜单的思想,但它是和HTML文本内容相互独立。虽然每一个菜单仅含有几行HTML代码,但要为每一个含有多重目的文件的超连接都编写这样的代码显然是不切实际的。我们需要一种简单、正式、类似于标记形式的结构,并且易于理解和使用,就像是我们开头提到的那两种方式。这就需要开发者们把注意力集中在内容的是献上而不是规划上。
在我叙述我的解决方法之前,我先提一点,很多支持这种复杂的对于web. xml与它的相关链接标准的工作已经在进行中,比如:XLink 和 XPointer,这俩都是在W3C里定义的标准,允许支持丰富的超链接功能。但这种高级连接标准依然没有被流行的浏览器支持(Internet Explorer就不支持:XLink),另外,:XLink很复杂,对于一般的WEB站点是承受不起的。
下面将来简单阐释一下如何用JSP定制标签(custom Tags)结合XML来创建丰富的超连接。
JSP 标签(Tags)
JSP tags在JSP页面提供了一种可重用性的强大机制,已于读写和维护页面,它使得JAVA
程序员在JSP代码里可以写出XML样式的标签而不是scriptlets,与HTML标记配合更加协调。这些标签是服务器端的资源,这些资源包含了用来为页面产生内容的应用逻辑。这样就增强了用户界面和”内容生成“逻辑之间的划分。

自定义标签(The Custom Tag)
从此处下载源代码(Download the source code for this article)
创建一个定制标签,首先我们先建立一个描述符(TLD)文件,用来描述标签的名字和属性,并把它和一个CLASS文件联系起来。TLD文件是基于XML格式的,放在服务器端的web-inf目录里,这些文件是WEB容器用来验证JSP tags的,下面这个TLD文件名字是multilink.tld:
<tag>
<name>multi</name>
<tagclass>util.tags.MultiLinkTag</tagclass>
<bodycontent>tagdependent</bodycontent>
<attribute>
<name>id</name>
<required>true</required>
</attribute>
<attribute>
<name>href</name>
<required>true</required>
</attribute>
<attribute>
<name>text</name>
<required>true</required>
</attribute>
<attribute>
<name>metalinks</name>
<required>true</required>
</attribute>
<attribute>
<name>onmouseover</name>
<required>false</required>
</attribute>
</tag>
标签的名字是multi, util.tags.MultiLinkTag是实现该标签功能的类,该类被称作标签处理器,按照JSP定制标签规范该处理器需要实现特定的接口。想了解更多有关资料,可以去SUN官方网站查阅document.tion。
为了方便学习,该标签还是模仿了HTML的标记,并有下列属性:
·ID, 标签ID.这将被用来创建HTML元素以支持动态菜单,对于本页面该标签ID必须是唯一的。
·href. 说明URL地址的属性,也类似于HTML。
·metalinks, XML文件的名称,包含嵌入在主连接里的连接信息。该文件分为几部分,用来设置每个连接,并且每一部分必须有名字属性,这类似于前面提高的标签ID.
·onmouseover。 一个可选项,用来说明当鼠标悬在下拉图标上或者点击了它时,是否弹出一个菜单。如果没有设置该项为true则取消鼠标悬停在图标上时的作用。
JSP页面代码里使用multilink.tld定义的标签需要声明一个前缀,就像是HTML里的标记<a>,我们在此也声明一个前缀”a”,这样multi标签的完整名称为<a:multi>,下面我们用一个实例来展示一下该标签的使用:
<%@ taglib uri="multilink.tld" prefix="a" %>
<html>
<body>
<p>
NASA's High-Speed Research program is developing a new
<a:multi href="http://someurl/"; id="hsct" metalinks="embedded_links.xml"
onmouseover="true">high-speed civil transport</a:multi>
passenger jet that is environment-friendly and economically viable.
The aircraft will have a cruise speed of
<a href="http://someurl/";>Mach</a> 2.4, and will feature an
<a:multi href="http://someurl/"; id="xvs" metalinks="embedded_links.xml"
onmouseover="false">external vision system</a:multi>
for low-speed operations, eliminating the need for a conventional
windshield or drooping nose.
</p>
</body>
</html>
为了方便学习,该标签还是模仿了HTML的标记,并有下列属性:
·ID, 标签ID.这将被用来创建HTML元素以支持动态菜单,对于本页面该标签ID必须是唯一的。
·href. 说明URL地址的属性,也类似于HTML。
·metalinks, XML文件的名称,包含嵌入在主连接里的连接信息。该文件分为几部分,用来设置每个连接,并且每一部分必须有名字属性,这类似于前面提高的标签ID.
·onmouseover。 一个可选项,用来说明当鼠标悬在下拉图标上或者点击了它时,是否弹出一个菜单。如果没有设置该项为true则取消鼠标悬停在图标上时的作用。
JSP页面代码里使用multilink.tld定义的标签需要声明一个前缀,就像是HTML里的标记<a>,我们在此也声明一个前缀”a”,这样multi标签的完整名称为<a:multi>,下面我们用一个实例来展示一下该标签的使用:
<%@ taglib uri="multilink.tld" prefix="a" %>
<html>
<body>
<p>
NASA's High-Speed Research program is developing a new
<a:multi href="http://someurl/"; id="hsct" metalinks="embedded_links.xml"
onmouseover="true">high-speed civil transport</a:multi>
passenger jet that is environment-friendly and economically viable.
The aircraft will have a cruise speed of
<a href="http://someurl/";>Mach</a> 2.4, and will feature an
<a:multi href="http://someurl/"; id="xvs" metalinks="embedded_links.xml"
onmouseover="false">external vision system</a:multi>
for low-speed operations, eliminating the need for a conventional
windshield or drooping nose.
</p>
</body>
</html>
最后我们大体看一下JSP标签的执行。标签有一个体,标签处理器继承自javax.servlet.jsp.tagext.BodyTagSupport.,并且它仅实现了doStartTag()和doAfterTag()这两个方法,doStartTag()方法仅返回EVAL_BODY_TAG,指明标签体需要评价,doAfterTag()方法处理所有自定制标签的操作,他返回SKIP_BODY,知名标签体已经不存在并不再被请求。标签体就是JSP标签打开和关闭元素之间的那部分。
下面是标签处理器的简略的代码文件,可以去这里(source code)下载完整的代码:
public class MultiLinkTag extends javax.servlet.jsp.tagext.BodyTagSupport
{
// Initialize variables and define setters
...

public int doStartTag() throws JspException {
// Indicate that we're interested in evaluating the tag's body
return EVAL_BODY_TAG;
}

public int doAfterBody() throws JspException {
// Process the tag's body and the embedded links
// found in the XML document.
...

// Don't need the tag's body any more.
return SKIP_BODY;
}
}
一旦标签处理器有错误,可以通过点击主连接来恢复它,下图是jsp页所显示的:
www.matrix.org.cn/upload/forum/2003829232803.gif
www.matrix.org.cn/upload/forum/2003829232821.gif
击"high-speed civil transport"超连接可以转到他所在的地址,把鼠标悬停在旁边的下拉图标上,会弹出个菜单,正如上图所示,你可以选一项然后会转到相应的地址,鼠标离开菜单后,弹出菜单自动消失。
该功能已在Internet Explorer 5.0+ 和 Netscape Navigator 6.0+.成功测试并通过,在其他浏览器上还没这项功能。
讨论:
多地址连接技术对于许多WEB使用者来说还是比较新颖的,假如用户们不愿用一些新思想,让他们接受一些完全的新导航功能也是一种挑战,因此现在采用基于现有的大家都熟悉的导航菜单来解决这个问题。在菜单系统里用户可以在一个主题里做一些选择,根据他们的选择转到相应的地方。
多地址连接使得用户有所选择。这样就减少了由于用户访问一些不相关的连接所消耗的时间和流量,并且能独立于HTML文本页面的内容存储连接信息~,以使得页面设计者可以独立于HTML文本去改变这些连接信息,这让人突发奇想到了动态超文本,即根据用户的需要来改变超文本。例如,页面设计师们改变连接以使其与用户联系更密切。
最后,下拉图标也是非常重要的。他从视觉上区分了一般的超连结和嵌入连接式的超连接,另外,onmouserover功能使得用户不需要点击图片,直接把鼠标悬在图标上就可以显示菜单。
总结:
本文描述了JSP定制标签扩充HTML超链接功能,也可以在.net平台上采用ASP.NET定制服务控制器来实现该功能
随着网络信息流量的日益增长,更方便的网页导航是必需的,可以增加些低成本而又能丰富WEB的改进。每天都有上百万的人浏览网页,所以很多事情需要做以使得网络更加强大更有使用价值,好让用户更好体验到上网的乐趣,真正的感触到网络生活的魅力所在!

标签集:TAGS:
回复Comments() 点击Count()

回复Comments

{commentauthor}
{commentauthor}
{commenttime}
{commentnum}
{commentcontent}
作者:
{commentrecontent}
}