Componentes de tabla que bloquean los encabezados de la fila y la columna

1. Introducir una definición de estilo en la página

<estilo>

.LockHeadtable {comportamiento: url (/oblog312/lockheadtable.htc)}

</style>

2. Agregue la declaración "class =" Lockheadtable "" a la definición de la tabla que necesita bloquear el encabezado de fila y columna. Otros parámetros incluyen

Rowheadnum = "recuento de filas bloqueadas"

Colheadnum = "número de columna bloqueada"

Rowheadstyle = "Línea de estilo de cabeza"

Colheadstyle = "Lista de estilo de encabezado"

RowStyle = "Línea estilo 1 | Estilo de línea 2 | ... | Estilo de línea N"

Focusstyle = "El estilo cuando obtienes el enfoque del mouse"

3. Al hacer clic en el título de la fila, puede ordenar los datos.

Aviso:

Al usar este componente, las celdas en los encabezados de la tabla de filas no pueden cruzar filas

ejemplo:

<TableClass = "Lockheadtable" Rowheadnum = 3Colheadnum = 1RowheadStyle = "Background:#F7F7F7; Color: Black;" ColheadStyle = "Fondo:#F7F7F7; Color: Black;" RowStyle = "Fondo:#F7F7F7; color: Negro;" RowStyle = "Background de fondo : #Ffffff; color: negro; | fondo:#f7f7f7; color: negro; "focusstyle =" fondo: verde; color: blanco; "width =" 1500 "border =" 1 "celular =" 3 "cellPacing =" 0 "align =" centro ">

Código fuente:

Lockheadtable.htc (programa de componentes)

<Public: componente>

<Public: Propertyname = "Rowheadnum"/>

<Public: Propertyname = "Colheadnum"/>

<Public: Propertyname = "Rowheadstyle"/>

<Public: Propertyname = "colheadstyle"/>

<Public: Propertyname = "RowStyle"/>

<Public: Propertyname = "FocusStyle"/>

<script>

// Inicialización

Rowheadnum = (rowheadnum == null? 0: parseint (rowheadnum, 10));

Colheadnum = (colheadnum == null? 0: parseint (colheadnum, 10));

Rowheadstyle = (rowheadstyle == null? "": Rowheadstyle);

Colheadstyle = (colheadstyle == null? "": Colheadstyle);

ArrRowStyle = (RowStyle == NULL? NewArray (""): RowStyle.Split ("|"));

// Establecer el encabezado de la tabla de filas

Vari, J, RowItem, CellItem;

rowhead = element.clonenode (true);

para (i = 0; i <rowheadnum; i ++) {

rowitem = element.rows (i);

rowitem.style.csstext = 'Z-Index: 10; posición: relativo; top: expresion (this.offsetparent.scrolltop);'+rowheadstyle;

}

// Establecer el encabezado de la lista

para (i = 0; i <element.rows.length; i ++) {

rowitem = element.rows (i);

if (i> = rowheadnum) {

rowitem.style.csstext = "Position: Relative;"+ArrrowStyle [(I-Rowheadnum)%ArrrowStyle.Length];

if (focusstyle! = null) {

RowItem.OnMouseOver = function () {this.style.csstext = "posición: relativo;"+focusstyle;}