14.6 小结
虽然HTML和Web应用自诞生以来已经发生了天翻地覆的变化,但Web表单相对却没什么改变。使用JavaScript可以增强已有的表单字段,从而创造出新的功能,或者提升表单的易用性。为此,表单、表单字段都引入了相应的属性和方法,以便JavaScript使用。下面是本章介绍的几个概念。
- 可以使用一些标准或非标准的方法选择文本框中的全部或部分文本。
- 大多数浏览器都采用了Firefox操作选择文本的方法,但IE仍然坚持自己的实现。
- 在文本框的内容变化时,可以通过侦听键盘事件以及检测插入的字符,来允许或禁止用户输入某些字符。
除Opera之外的所有浏览器都支持剪贴板事件,包括copy
、cut
和paste
。其他浏览器在实现剪贴板事件时也分为几种不同的情况。
- IE、Firefox、Chrome和Safari允许通过JavaScript访问剪贴板中的数据,而Opera不允许这种访问方式。
- 即使是IE、Chrome和Safari,它们各自的实现方式也不相同。
- Firefox、Safari和Chrome只允许在paste事件发生时读取剪贴板数据,而IE没有这个限制。
- Firefox、Safari和Chrome只允许在发生剪贴板事件时访问相关的信息,而IE允许在任何时候访问相关信息。
在文本框内容必须限制为某些特定字符的情况下,就可以利用剪贴板事件来屏蔽通过粘贴向文本框中插入内容的操作。
选择框也是经常要通过JavaScript来控制的一个表单字段。由于有了DOM,对选择框的操作比以前要方便多了。添加选项、移除选项、将选项从一个选择框移动到另一个选择框,甚至对选项进行排序等操作,都可以使用标准的DOM技术来实现。
富文本编辑功能是通过一个包含空HTML文档的iframe
元素来实现的。通过将空文档的designMode
的属性设置为“on”,就可以将该页面转换为可编辑状态,此时其表现如同字处理软件。另外,也可以将某个元素设置为contenteditable
。在默认情况下,可以将字体加粗或将文本转换为斜体,还可以使用剪贴板。JavaScript通过使用execCommand()
方法也可以实现相同的一些功能。另外,使用queryCommandEnabled()
、queryCommandState()
和queryCommandValue()
方法则可以取得有关文本选区的信息。由于这种方式构建的富文本编辑器并不是一个表单字段,因此在将其内容提交给服务器之前,必须将iframe或contentEditable元素中的HTML复制到一个表单字段中。
【本文内容摘自:《JavaScript高级程序设计》(第3版)Nicholas C.Zakas 著 李松峰 曹力 译】