1.概述
当你和页面交互的时候通过高亮选择元素能增加页面的交互性和易用性,它主要用于表单,但是它也可以用于表格(table)、列表(lists)、或者你指定的任何元素。、
使用案例
- 当制表到一个表单时,通过在高亮元素周围,使得表单填充更清晰。
- 当鼠标经过或者单击表格中的行时,高亮使它看起来更明显
- 元素会被切换当你单击他们时。
2.基本用法
高亮插件的用法是:$(selector).highlight(parentSelector, highlightClass, startEvent, endEvent)
高亮原理的工作原理是通过给目标的父元素添加一个class属性。
举例来说,当一个text field被一个li元素所包含时,li元素会为text field添加'highlight'class属性当它获得焦点时,同时当text field失去焦点时会移除highlight的class属性。
通过默认, 高亮为一般的用法选择默认值,因此对于目标元素使用基本的语法是很容易的,举例来说:$('form').highlight()
3。默认的标签和class属性
高亮插件对于一些通用的HTML元素设置了一些默认值,示例如下:
selector | parentSelector | highlightClass | startEvent | endEvent |
form | li | 'highlight' | focus | blur |
table | tr | 'highlight' | mouseover | mouseout |
ul, ol | li | 'highlight' | mouseover | mouseout |
翻译地址:http://www.keyframesandcode.com/resources/javascript/jQuery/demos/highlight-demo.html