XUL教程:对XBL元素进行扩展

本文配套源码

原文标题:XUL Tutorial - Bindings - XBL Inheritance

原文作者:Neil Deakin

原文地址:http://www.xulplanet.com/tutorials/xultu/xblinherit.html

下面是对原文的翻译:

在这一小节,我们将学习如果对已有的XBL定义进行扩展。

继承(Inheritance)

有时你要建立的组件可能和现有的某个组件很相似,比如你想建立一个可以弹出菜单的按钮,一种方法是重复造车轮,复制现有的button代码,但有一种更好的方法,就是继承现有的button代码。

所有的绑定项都可以被扩展,而且子绑定项可以额外添加属性、方法和事件处理程序。子绑定项也同时具有在父绑定项中定义的所有功能(还包括父绑定项的父绑定项的所有功能,一直按照树型模型追溯下去的所有功能)。

要扩展一个现有的绑定项,首先要向binding标记中增加extends特性。比如下面这个例子,建立了一个文本框,而且当按下F4键的时候会向文本框的内容前添加“http://www”。

实例11.7.1:源代码

<binding id="textboxwithhttp"
extends="chrome://global/content/bindings/textbox.xml#textbox">
<handlers>
<handler event="keypress" keycode="VK_F4">
this.value="http://www"+value;
</handler>
</handlers>
</binding>

上面这个绑定项就是从textbox元素扩展出来的。extends特性中对应的URL指的是textbox元素对应的绑定项的实际地址。这就意味 着我们继承了所有textbox绑定项提供的行为和内容。另外,我们又增加了一个keypress事件用于响应按F4键这个动作。

自动完成输入的文本框(Autocompleting TextBoxes)

下面的例子类似于Mozilla自带的地址自动输入功能。从基本文本框的绑定项继承下来的文本框都将支持自动完成输入的功能。

自动完成输入的文本框额外增加了一个事件句柄,当在文本框输入内容的时候,一个判断后续内容的列表就会自动显示出来。你可以在自己的应用程序中使用这项功能,只需要建立一个附加两个额外特性的文本框即可。

<textbox type="autocomplete" searchSessions="history"/>

将type特性设置为autocomplete,这样就将自动完成输入功能添加到文本框中。通过searchSessions设置在什么地方查找数 据,在这个例子中,设置成history,代表从URL的历史记录中查找数据。(还可以设置为addrbook,代表从地址本中查找数据)

在下一小结,我们将利用前面学到的知识完整构建一个XBL组件。

时间: 2024-09-09 15:32:32

XUL教程:对XBL元素进行扩展的相关文章

XUL教程:为XBL元素定义内容

本文配套源码 原文:http://www.xulplanet.com/tutorials/xultu/xblcontent.html 原文作者:Neil Deakin 下面是对原文的翻译: 匿名内容(Anonymous Content) 在这一小节,我们将探讨如何使用XBL建立内容. XBL Content XBL可以被用来向一个元素中添加一组元素.在XUL中只需要定义最外层的元素,而里面的元素都可以在XBL中定义.对于开发那些由一系列元素组成 的组件(widget)来说,这是再好不过的功能,只

XUL教程:为XBL元素定义事件

原文标题:XUL Tutorial - Bindings - Adding Events 原文作者:Neil Deakin 原文地址:http://www.xulplanet.com/tutorials/xultu/xblevents.html 下面是对原文的翻译: 这一节,我们来学习如何向XBL元素中添加事件处理程序. 事件处理程序(Event Handlers) 正如你所期望的,匿名内容里的元素支持鼠标点击.键盘按下等事件.但你可能会想采用一种特别方式触发事件和处理程序.如果需要,你可以向匿

XUL教程:为XBL元素定义属性

原文标题:XUL Tutorial - Bindings - Adding Properties 原文作者:Neil Deakin 原文地址:http://www.xulplanet.com/tutorials/xultu/xblprops.html 下面是对原文的翻译: 添加属性(Adding Properties) 在这一节,我们将学习怎样为XBL元素增加自定义属性. XBL接口 通过JavaScript和DOM,可以对元素的属性进行访问.在XBL中,你可以为元素自定义属性,当然也可以为元素

XUL教程:为XBL元素定义方法

原文标题:XUL Tutorial - Bindings - Adding Methods 原文作者:Neil Deakin 原文地址:http://www.xulplanet.com/tutorials/xultu/xblmethods.html 以下是对原文的翻译: 接下来我们学习如何向XBL中定义的元素添加方法. 方法(Methods) 既然可以向XBL定义的元素添加属性,自然就可以添加方法,这些方法可以在脚本中调用.方法表现为对象的函数,比如"window.open()".你可

XUL教程:什么是XBL?

原文:http://www.xulplanet.com/tutorials/xultu/introxbl.html 原文作者:Neil Deakin 以下为对原文的翻译: 什么是XBL? XUL有一个姐妹语言,叫做XBL,全称是可扩展绑定语言(eXtensible Bindings Language),这门语言的主要作用就是用来定义XUL组件的行为模式. 绑定 你可以使用XUL定义一个应用程序界面的布局.你也可以通过设置样式来定制这些元素的外观.你还可以通过修改样式来建立新的皮肤.类似滚动条或者

XUL教程:实例构建XBL组件

本文配套源码 原文标题:XUL Tutorial - Bindings - XBL Example 原文作者:Neil Deakin 原文地址:http://www.xulplanet.com/tutorials/xultu/xblex.html 下面是对原文的翻译: 这节将介绍一个XBL的完整例子. 幻灯片元素(A Slideshow Element) 让我们构建一个完整的使用XBL元素的例子,这是一个保存了一组对象的组件,而每页只会显示其中一个.置于下方的导航按钮用于循环显示这些对象,而在一

asp教程:fso获取的文件扩展名

asp教程:fso获取的文件扩展名 这个例子演示如何使用GetExtensionName方法得到的文件扩展名的最后部分中指定的路径. 来看个获取文章扩展名的实例教程吧. <html> <body> <% Set fs=Server.CreateObject("Scripting.FileSystemObject") Response.Write("The file extension of the file 3dgarro is: ")

XUL教程:为XBL元素定义特性

原文地址:http://www.xulplanet.com/tutorials/xultu/xblatin.html 原文作者:Neil Deakin 以下是对原文的翻译: XBL特性继承(XBL Attribute Inheritance) 在这个小节我们将学习特性的继承方式. 继承的特性(Inherited Attributes) XBL可以让我们把复杂组件的实际实现方法隐藏起来.但是用目前为止介绍的功能,我们只能使用同样的方法建立匿名内容.如果我们可以通过为绑定元素增加特性,来修改内部的元

CSS教程:用伪元素控制网页表单样式

文章简介:然而,所有这些伪元素都是依赖于特定浏览器引擎的(所以要带有浏览器引擎前缀),这样方便区分特定的浏览器引擎.以下是我自己搜集整理的,在Trident, Gecko, 和 WebKit浏览器引擎下面都可用的伪元素列表.在我写这篇文章的同时,发布了一些webkit的伪元素,所以现在 当开发web应用程序时,表单样式是个头疼的问题.以前,web开发人员不得不接受一个现实,就是由客户端浏览器控制表单样式.然而,作者通过伪元素给web渲染引擎添加钩子,就可以控制表单的显示. 然而,所有这些伪元素都