Componentes da tabela que travam os cabeçalhos da linha e da coluna

1. Apresente uma definição de estilo na página

<estilo>

.Lockheadtable {comportamento: url (/blog312/lockheadtable.htc)}

</style>

2. Adicione a instrução "Class =" Lockheadtable "" à definição da tabela que precisa bloquear o cabeçalho da linha e da coluna. Outros parâmetros incluem

Rowheadnum = "Contagem de linhas bloqueadas"

Colheadnum = "Número da coluna bloqueada"

Rowheadstyle = "estilo de cabeça de linha"

Colheadstyle = "estilo de cabeçalho da lista"

RowStyle = "Estilo de linha 1 | Estilo de linha 2 |… | Estilo de linha n"

Focusstyle = "O estilo quando você obtém o foco do mouse"

3. Ao clicar no título da linha, você pode classificar os dados.

Perceber:

Ao usar este componente, as células nos cabeçalhos da mesa de linha não podem cruzar linhas

exemplo:

<tableClass = "LockHeadtable" rowHeadnum = 3colheadnum = 1RowheadStyle = "Background:#f7f7f7; cor: preto;" colheadstyle = "Background:#f7f7f7; cor: black;" rowstyle = "Background:#f7f7; color: preto; rowsyle; : #Ffffff; cor: preto; | fundo:#f7f7f7; cor: preto; "focusstyle =" background: verde; cor: branco; "width =" 1500 "border =" 1 "CellPadding =" 3 "CellPacing =" 0 "align =" Center ">

código -fonte:

Lockheadtable.htc (programa de componentes)

<Público: componente>

<Public: PropertyName = "RowHeadnum"/>

<Public: PropertyName = "Colheadnum"/>

<Public: PropertyName = "Rowheadstyle"/>

<Public: PropertyName = "ColheadStyle"/>

<Public: PropertyName = "RowStyle"/>

<Public: PropertyName = "FocusStyle"/>

<Cript>

// inicialização

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 ("|"));

// Defina o cabeçalho da mesa de linha

Vari, J, RowItem, CellItem;

rowhead = element.cloneNode (true);

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

rowItem = element.Rows (i);

rowItem.style.csStext = 'Z-Index: 10; Posição: relativa; topo: expressão (this.OffSetParent.Scrolltop);'+rowheadstyle;

}

// Defina o cabeçalho da lista

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

rowItem = element.Rows (i);

if (i> = rowheadnum) {

rowItem.style.csStext = "Posição: relativa;"+arrrowStyle [(i-rowheadnum)%arrrowstyle.length];

if (focusstyle! = null) {

rowItem.onMouseOver = function () {this.style.csStext = "Position: relativamente;"+focusstyle;}