综合类一个非常不错的数据列的排序脚本
把下列代码加到网页的<body></body>标签之间 从google下载我的照片管理软件要完成此效果需要两个步骤
第一步:把如下代码加入到<head>区域中
<style type=text/css>
.listdatatable {
font-size: 15px; font-family: "arial"
}
.listtablehead {
font-weight: bold; cursor: hand; font-family: "arial"
}
.onmouseontr {
cursor: default; color: #ffffff; background-color: #006699
}
.listtableheado {
font-weight: bold; cursor: s-resize; color: #ffffff; font-family: "arial";
background-color: #006699
}
.listheadclicked {
font-weight: bold; cursor: n-resize; color: #ffffff; background-color: #990033
}
.listheadclicked0 {
font-weight: bold; cursor: s-resize; color: #ffffff; background-color: #990033
}
</style>
<!-- .listdatatable //数据表的总风格 -->
<!-- .listtablehead //数据表头的风格 -->
<!-- .onmouseontr //鼠标移到时风格 -->
<!-- .listtablehead0 //数据表头鼠标移到时的风格 -->
<!-- .listheadclicked //表头被选择时的风格 -->
<!-- .listheadclicked0 //表料再选择风格 -->
第二步:把如下代码加入到<body>区域中
<script>
function jm_jumppage(direct,page,rows){
page=(direct=='up')?page-1:page+1;
document.location='openings.php?page0='+page+'&rowslimit='+rows;
}
function jm_hltr(hstyle){
esrcobject=event.srcelement
if (esrcobject.tagname=="table")
return
while(esrcobject.tagname!="tr"&&esrcobject.onyes!='head')
esrcobject=esrcobject.parentelement
if (esrcobject.classname!=hstyle&&esrcobject.onyes!='head'&&esrcobject.id!="ignore"&&esrcobject.classname!='delstyle'&&esrcobject.classname!='listtablehead'&&esrcobject.classname!='listtablehead0'){
esrcobject.classname=hstyle}
if (esrcobject.onyes=='head'&&esrcobject.classname!='listheadclicked'&&esrcobject.classname!='listheadclicked0'){
esrcobject.classname='listtableheado';
}
}
function jm_hltrrestore(sstyle){
if (event.fromelement.contains(event.toelement)||esrcobject.contains(event.toelement)||esrcobject.id=="ignore"||esrcobject.classname=='delstyle')
return
if (event.toelement!=esrcobject){
if (event.srcelement.onyes=='head'&&esrcobject.classname!='listheadclicked'&&esrcobject.classname!='listheadclicked0'){
event.srcelement.classname='listtablehead'}
else if(esrcobject.classname!='listheadclicked'&&esrcobject.classname!='listheadclicked0'){
esrcobject.classname=sstyle}
}
}
function jm_powerlist(colnum){
headeventobject=event.srcelement
while(headeventobject.tagname!="tr"){
headeventobject=headeventobject.parentelement}
for (i=0;i<headeventobject.children.length;i++){
if (headeventobject.children!=event.srcelement){
headeventobject.children.classname='listtablehead'}
}
var tablerows=0;
trobject=datatable.children.children
for (i=0;i<trobject.length;i++){
object=datatable.children.children;
tablerows=(trobject.id=='ignore')?tablerows:tablerows+1;
}
var trinnerhtml=new array(tablerows)
var tdinnerhtml=new array(tablerows)
var tdnumber=new array(tablerows)
var i0=0
var i1=0
for (i=0;i<trobject.length;i++){
if (trobject.id!='ignore'){
trinnerhtml=trobject.innerhtml;
tdinnerhtml=trobject.children.innerhtml;
tdnumber=i;
i0++;
}
}
sourcehtml=clearstart.children.outerhtml;
//alert(sourcehtml);
for (bi=0;bi<tablerows;bi++){
for (i=0;i<tablerows;i++){
if(tdinnerhtml>tdinnerhtml){
t_s=tdnumber;
t_b=tdnumber;
tdnumber=t_b;
tdnumber=t_s;
temp_small=tdinnerhtml;
temp_big=tdinnerhtml;
tdinnerhtml=temp_big;
tdinnerhtml=temp_small;
}
}
}
var showshow='';
var numshow='';
for (i=0;i<tablerows;i++){
showshow=showshow+tdinnerhtml+'\n';
numshow=numshow+tdnumber+'|';
}
sourcehtml_head=sourcehtml.split("<tbody>");
numshow=numshow.split("|");
var trrebuildhtml='';
if (event.srcelement.classname=='listheadclicked'){
for (i=0;i<tablerows;i++){
trrebuildhtml=trrebuildhtml+trobject].outerhtml;
}
event.srcelement.classname='listheadclicked0';
}else{
for (i=0;i<tablerows;i++){
trrebuildhtml=trrebuildhtml+trobject].outerhtml;
}
event.srcelement.classname='listheadclicked';
}
var datarebuildtable='';
datarebuildtable=sourcehtml_head+trobject.outerhtml+trrebuildhtml+trobject.outerhtml+'</table>';
clearstart.innerhtml='';
clearstart.innerhtml=datarebuildtable;
}
</script>
<table border=0 cellpadding=3 cellspacing=0 width="100%">
<tbody>
<tr>
<td id=clearstart>
<table border=0 cellpadding=2 cellspacing=2
class=listdatatable id=datatable
onmouseout="jm_hltrrestore('')"
onmouseover="jm_hltr('onmouseontr')" width="100%">
<tbody>
<tr bgcolor=#eeeeee id=ignore>
<td class=listtablehead onclick=jm_powerlist(0)
onyes="head">positions</td>
<td class=listtablehead onclick=jm_powerlist(1)
onyes="head">code</td>
<td class=listtablehead onclick=jm_powerlist(2)
onyes="head">nop</td>
<td class=listtablehead onclick=jm_powerlist(3)
onyes="head">company profile</td>
<td class=listtablehead onclick=jm_powerlist(4)
onyes="head">required industry</td>
<td class=listtablehead onclick=jm_powerlist(5)
onyes="head">location</td></tr>
<tr bgcolor=#f7f7f7>
<td>financial manager</td>
<td>000904122</td>
<td align=middle>1</td>
<td>multinational bank</td>
<td>banking</td>
<td align=middle>gz</td></tr>
<tr bgcolor=#fdfdfd>
<td>operation manager</td>
<td>000904031</td>
<td align=middle>1</td>
<td>leading us company</td>
<td>manufacturing</td>
<td align=middle>gz</td></tr>
<tr bgcolor=#f7f7f7>
<td>infrastructure engineer</td>
<td>000904026</td>
<td align=middle>1</td>
<td>top 100 us company (mfg)</td>
<td>it</td>
<td align=middle>gz</td></tr>
<tr bgcolor=#fdfdfd>
<td>logistics manager</td>
<td>000901018</td>
<td align=middle>1</td>
<td>leading european company</td>
<td>logistics</td>
<td align=middle>sy</td></tr>
<tr bgcolor=#f7f7f7>
<td>erp consultant leader</td>
<td>000901008</td>
<td align=middle>1</td>
<td>big 5 cpa firm</td>
<td>it</td>
<td align=middle>sh</td></tr>
<tr bgcolor=#fdfdfd>
<td>national it manager</td>
<td>000831044</td>
<td align=middle>1</td>
<td>leading european company</td>
<td>logistics</td>
<td align=middle>sh</td></tr>
<tr bgcolor=#f7f7f7>
<td>financial analyst</td>
<td>000828533</td>
<td align=middle>1</td>
<td>top 100 us company (mfg)</td>
<td>finance</td>
<td align=middle>gz</td></tr>
<tr bgcolor=#fdfdfd>
<td>solicitor</td>
<td>000828033</td>
<td align=middle>2</td>
<td>multinational law firm</td>
<td>legal</td>
<td align=middle>gz</td></tr>
<tr bgcolor=#f7f7f7>
<td>translator/interpreter</td>
<td>000828032</td>
<td align=middle>2</td>
<td>multinational firm</td>
<td>legal</td>
<td align=middle>gz</td></tr>
<tr bgcolor=#fdfdfd>
<td>engineering leader</td>
<td>000827468</td>
<td align=middle>1</td>
<td>leading us company</td>
<td>chemicals</td>
<td align=middle>gz</td></tr>
<tr bgcolor=#f7f7f7>
<td>qa manager/leader</td>
<td>000826432</td>
<td align=middle>2</td>
<td>leading us company</td>
<td>chemicals</td>
<td align=middle>gz/sh</td></tr>
<tr bgcolor=#fdfdfd>
<td>hr manager</td>
<td>000826307</td>
<td align=middle>1</td>
<td>famous european company</td>
<td>it</td>
<td align=middle>gz</td></tr>
<tr bgcolor=#f7f7f7>
<td>financial manager</td>
<td>000825313</td>
<td align=middle>1</td>
<td>top 100 us company (mfg)</td>
<td>finance</td>
<td align=middle>gz</td></tr>
<tr bgcolor=#fdfdfd>
<td>application design e</td>
<td>000824303</td>
<td align=middle>1</td>
<td>leading us company</td>
<td>chemicals</td>
<td align=middle>gz</td></tr>
<tr bgcolor=#f7f7f7>
<td>legal advisor</td>
<td>000818337</td>
<td align=middle>2</td>
<td>top 100 us company</td>
<td>commercial</td>
<td align=middle>gz/sh</td></tr>
<tr bgcolor=#fdfdfd>
<td>sales</td>
<td>000817102</td>
<td align=middle>2</td>
<td>multinational si</td>
<td>it</td>
<td align=middle>gz</td></tr>
<tr bgcolor=#f7f7f7>
<td>engineer</td>
<td>000816331</td>
<td align=middle>2</td>
<td>multinational si</td>
<td>it</td>
<td align=middle>gz</td></tr>
<tr bgcolor=#fdfdfd>
<td>senior accountant</td>
<td>000811330</td>
<td align=middle>2</td>
<td>multinational bank</td>
<td>banking</td>
<td align=middle>gz</td></tr>
<tr bgcolor=#f7f7f7>
<td>process specialist</td>
<td>000811222</td>
<td align=middle>1</td>
<td>top 100 us company</td>
<td>chemicals</td>
<td align=middle>gz</td></tr>
<tr bgcolor=#fdfdfd>
<td>consultant</td>
<td>000725386</td>
<td align=middle>2</td>
<td>top 100 us company</td>
<td>it</td>
<td align=middle>gz/sh</td></tr>
<tr id=ignore>
<td align=right
colspan=6></td></tr></tbody></table></td></tr></tbody></table>
页:
[1]