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;}