点击表头排序的几种方法 & 动态表格

 

 

我记得老早老早大家就开始在经典讨论表格排序的问题了,过了这么多年,这个问题的解决方案层出不穷,见仁见智。
用script,htc,xml+xsl等等怎么着都能实现,只是效率不同罢了。
今天正好学习.net的时候学到这一块,顺道把以前和大家讨论过的知识整理回顾并总结一下。

1, CSS+HTC(HTML Component)
微软的这个方法简单,在经典里面也火了一阵,下载Dave Massy做好了的组件,只需要在表格的style里面加入behavior:url(xxx.htc);就可以了.
不过这个方法有个缺点就是需要服务器端运行,在硬盘里直接运行是不管用的。而且需要IE5以后的浏览器,不支持FF等其他的。
演示:http://msdn.microsoft.com/library/en-us/dndude/html/Qual.asp
官方地址:
http://msdn.microsoft.com/library/default.asp?url=/library/en-us/dndude/html/dude07232001.asp

2,script法
这算是目前用得比较多的一种方法了。像http://bt1.btchina.net就用的script实现的表格排序。btchina的表格排序的script源文件使用的是Erik Arvidsson(WebFX)做的一款程序叫做Sortable Table。官方有强大的技术支持。清访问http://webfx.eae.net/dhtml/tablesort/tablesort.html这款程序相对效率比较高。
演示:http://webfx.eae.net/dhtml/sortabletable/demo.html
官方地址:http://webfx.eae.net/dhtml/tablesort/tablesort.html

3,领军人物windy_sk(wind2000)的script代码.
老牌的,绝对是经典高手,在经典里掀起波澜无数.最早学习的就是他的代码.原贴:
http://www.blueidea.com/bbs/NewsDetail.asp?id=697036

4,还有一些职业高手的代码,以后继续总结.
还有菜鸟sipo用.net做的代码....(勿笑勿笑)

核心代码是:
If viewstate("sortexp") Is Nothing Then
viewstate("sortexp") = e.SortExpression.ToString
ElseIf viewstate("sortexp") = e.SortExpression.ToString Then
viewstate("sortexp") += " desc"
Else
viewstate("sortexp") = e.SortExpression.ToString
End If

感谢miles帮助!asp.net的代码终于放上来了,演示:http://www.dc9.cn/c/webform1.aspx

谢谢... 


附:动态表格(20021118 改完)

作者-Windy2000

主要特点:

任意标准数据表格(无跨行和跨列),只要设定 id (默认为 id = PowerTable )即可生效!

任意修改、删除、编辑、表格行列,支持拖动表头交换列;

按列中英文排序(中文排序支持拼音和笔画,500 行 中文排序 不到 3 秒!感谢 myhyli 帮助,提高了排序速度)

倒出生成精简数据表(无冗余代码)

相关显示颜色可以通过下面变量自行定制
show_col       = false;
charMode       = 1;
act_bgc       = "#BEC5DE";
act_fc       = "black";
cur_bgc       = "#ccffcc";
cur_fc       = "black";

ATT. 如果在较大的页面中引用,请将 window.onload 事件的内容指向 PowerTable 之后!

PS. 我的汉字排序方法和秋水的应该至少是相当的,都是引用字表,取索引位,只是没有加上拼音识别罢了,就效率上应该相当的(原理都一样)!

 

<!--
All Files Design & Write by Windy_sk, you can use it freely but ...
YOU MUST KEEP THIS ITEM !
Email: seasonx@163.net
-->
< meta  http-equiv ="Content-Type"  content ="text/html; charset=gb2312" >
< title > Power Table </ title >
< style >
body
{
    FONT-SIZE
:  9pt ;  PADDING-RIGHT :  0px ;  PADDING-LEFT :  0px ;  PADDING-BOTTOM :  0px ;  PADDING-TOP :  0px ;
}
input 
{
    FONT-SIZE
:  9pt ;  height :  15pt ;  width : 50px ;  cursor :  default ;
}
table
{
    font-size
:  9pt ;
    word-break
: break-all ;
    cursor
:  default ;
    BORDER
:  black 1px solid ;
    background-color
: #eeeecc ;
    border-collapse
: collapse ;
    border-Color
: #999999 ;
    align
: center ;
}
</ style >
< script  language ="JavaScript1.2" >
/*
 This following code are designed and writen by Windy_sk <seasonx@163.net>
 You can use it freely, but u must held all the copyright items!
*/ var  Main_Tab     =   null ;
var  cur_row     =   null ;
var  cur_col     =   null ;
var  cur_cell     =   null ;
var  Org_con     =   "" ;
var  sort_col     =   null ; var  show_col     =   false ;
var  charMode     =   1 ;
var  act_bgc     =   " #BEC5DE " ;
var  act_fc     =   " black " ;
var  cur_bgc     =   " #ccffcc " ;
var  cur_fc     =   " black " ; function  init(){
    cur_row            
=   null ;
    cur_col            
=   null ;
    cur_cell        
=   null ;
    sort_col        
=   null ;
    Main_Tab         
=  PowerTable;
    read_def(Main_Tab)
    Main_Tab.onmouseover    
=  overIt;
    Main_Tab.onmouseout    
=  outIt;
    Main_Tab.onclick    
=  clickIt;
    Main_Tab.ondblclick    
=  dblclickIt;
    Org_con            
=  Main_Tab.outerHTML;
    
    arrowUp 
=  document.createElement( " SPAN " );
    arrowUp.innerHTML    
=   " 5 " ;
    arrowUp.style.cssText     
=   " PADDING-RIGHT: 0px; MARGIN-TOP: -3px; PADDING-LEFT: 0px; FONT-SIZE: 10px; MARGIN-BOTTOM: 2px; PADDING-BOTTOM: 2px; OVERFLOW: hidden; WIDTH: 10px; COLOR: blue; PADDING-TOP: 0px; FONT-FAMILY: webdings; HEIGHT: 11px " ;    arrowDown  =  document.createElement( " SPAN " );
    arrowDown.innerHTML    
=   " 6 " ;
    arrowDown.style.cssText 
=   " PADDING-RIGHT: 0px; MARGIN-TOP: -3px; PADDING-LEFT: 0px; FONT-SIZE: 10px; MARGIN-BOTTOM: 2px; PADDING-BOTTOM: 2px; OVERFLOW: hidden; WIDTH: 10px; COLOR: blue; PADDING-TOP: 0px; FONT-FAMILY: webdings; HEIGHT: 11px " ;
}
function  window.onload(){
    init();
    
    drag 
=  document.createElement( " DIV " );
    drag.innerHTML        
=   "" ;
    drag.style.textAlign     
=   " center " ;
    drag.style.position     
=   " absolute " ;
    drag.style.cursor     
=   " hand " ;
    drag.style.border     
=   " 1 solid black " ;
    drag.style.display     
=   " none " ;
    drag.style.zIndex     
=   " 999 " ;
    
    document.body.insertBefore(drag);
    setInterval(
" judge_move() " , 100 );
    setInterval(
" showContent.value=Main_Tab.innerHTML;monitor.value='cur_row: '+cur_row+'; cur_col: '+cur_col + '; sort_col: ' +sort_col " , 1000 );    sel_Mode.selectedIndex = charMode;
}
function  judge_move(){
    move[
0 ].disabled = (cur_row  ==   null   ||  cur_row <= 1 );
    move[
1 ].disabled = (cur_row  ==   null   ||  cur_row == Main_Tab.rows.length - 1   ||  cur_row  ==   0 );
    move[
2 ].disabled = (cur_col  ==   null   ||  cur_col == 0 );
    move[
3 ].disabled = (cur_col  ==   null   ||  cur_col == Main_Tab.rows[ 0 ].cells.length - 1 );
}document.onselectstart    
=   function (){ return   false ;}document.onmouseup     =  drag_end; function  clear_color(){
    the_table
= Main_Tab;
    
if (cur_col != null ){
        
for (i = 0 ;i < the_table.rows.length;i ++ ){
            
with (the_table.rows[i].cells[cur_col]){
                style.backgroundColor
= oBgc;
                style.color
= oFc;
            }
        }
    }
    
if (cur_row != null ){
        
for (i = 0 ;i < the_table.rows[cur_row].cells.length;i ++ ){
            
with (the_table.rows[cur_row].cells[i]){
                style.backgroundColor
= oBgc;
                style.color
= oFc;
            }
        }
    }
    
if (cur_cell != null ){
        cur_cell.children[
0 ].contentEditable  =   false ;
        
with (cur_cell.children[ 0 ].runtimeStyle){
            borderLeft
= borderTop = "" ;
            borderRight
= borderBottom = "" ;
            backgroundColor
= "" ;
            paddingLeft
= "" ;
            textAlign
= "" ;
        }
    }
}
function  document.onclick(){
    window.status 
=   "" ;
    clear_color();
    cur_row  
=   null ;
    cur_col  
=   null ;
    cur_cell 
=   null ;
}
function  read_def(the_table){
    
for ( var  i = 0 ;i < the_table.rows.length;i ++ ){
        
for ( var  j = 0 ;j < the_table.rows[i].cells.length;j ++ ){
            
with (the_table.rows[i]){
                cells[j].oBgc 
=  cells[j].currentStyle.backgroundColor;
                cells[j].oFc  
=  cells[j].currentStyle.color;
                
if (i == 0 ){
                    cells[j].onmousedown    
=  drag_start;
                    cells[j].onmouseup    
=  drag_end;
                }
            }
        }
    }
}
function  get_Element(the_ele,the_tag){
    the_tag 
=  the_tag.toLowerCase();
    
if (the_ele.tagName.toLowerCase() == the_tag) return  the_ele;
    
while (the_ele = the_ele.offsetParent){
        
if (the_ele.tagName.toLowerCase() == the_tag) return  the_ele;
    }
    
return ( null );
}
var  dragStart         =   false ;
var  dragColStart     =   null ;
var  dragColEnd         =   null ; function  drag_start(){
    
var  the_td     =  get_Element(event.srcElement, " td " );
    
if (the_td == null return ;
    dragStart    
=   true ;
    dragColStart    
=  the_td.cellIndex;
    drag.style.width    
=  the_td.offsetWidth;
    drag.style.height    
=  the_td.offsetHeight;
    
function  document.onmousemove(){
        drag.style.display    
=   "" ;
        drag.style.top        
=  event.y  -  drag.offsetHeight / 2 ;
        drag.style.left        
=  event.x  -  drag.offsetWidth / 2 ;
        
for ( var  i = 0 ;i < Main_Tab.rows[ 0 ].cells.length;i ++ ){
            
with (Main_Tab.rows[ 0 ].cells[i]){
                
if ((event.y > offsetTop + parseInt(document.body.currentStyle.marginTop)  &&  event.y < offsetTop + offsetHeight + parseInt(document.body.currentStyle.marginTop))  &&  (event.x > offsetLeft + parseInt(document.body.currentStyle.marginLeft)  &&  event.x < offsetLeft + offsetWidth + parseInt(document.body.currentStyle.marginLeft))){
                    runtimeStyle.backgroundColor
= act_bgc;
                    dragColEnd
= cellIndex;
                }
else {
                    runtimeStyle.backgroundColor
= "" ;
                }
            }
        }
        
if ( ! (event.y > Main_Tab.rows[ 0 ].offsetTop + parseInt(document.body.currentStyle.marginTop)  &&  event.y < Main_Tab.rows[ 0 ].offsetTop + Main_Tab.rows[ 0 ].offsetHeight + parseInt(document.body.currentStyle.marginTop))) dragColEnd = null ;
    }
    drag.innerHTML 
=  the_td.innerHTML;
    drag.style.backgroundColor 
=  the_td.oBgc;
    drag.style.color 
=  the_td.oFc;
}
function  drag_end(){
    dragStart 
=   false ;
    drag.style.display
= " none " ;
    drag.innerHTML 
=   "" ;
    drag.style.width 
=   0 ;
    drag.style.height 
=   0 ;
    
for ( var  i = 0 ;i < Main_Tab.rows[ 0 ].cells.length;i ++ ){
        Main_Tab.rows[
0 ].cells[i].runtimeStyle.backgroundColor = "" ;
    }
    
if (dragColStart != null   &&  dragColEnd != null   &&  dragColStart != dragColEnd){
        change_col(Main_Tab,dragColStart,dragColEnd);
        
if (dragColStart == sort_col)sort_col = dragColEnd;
        
else   if (dragColEnd == sort_col)sort_col = dragColStart;
        document.onclick();
    }
    dragColStart 
=   null ;
    dragColEnd 
=   null ;
    document.onmousemove
= null ;
}
function  clickIt(){
    event.cancelBubble
= true ;
    
var  the_obj  =  event.srcElement;
    
var  i  =   0  ,j  =   0 ;
    
if (cur_cell != null   &&  cur_row != 0 ){
        cur_cell.children[
0 ].contentEditable  =   false ;
        
with (cur_cell.children[ 0 ].runtimeStyle){
            borderLeft
= borderTop = "" ;
            borderRight
= borderBottom = "" ;
            backgroundColor
= "" ;
            paddingLeft
= "" ;
            textAlign
= "" ;
        }
    }
    
if (the_obj.tagName.toLowerCase()  !=   " table "   &&  the_obj.tagName.toLowerCase()  !=   " tbody "   &&  the_obj.tagName.toLowerCase()  !=   " tr " ){
        
var  the_td     =  get_Element(the_obj, " td " );
        
if (the_td == null return ;
        
var  the_tr     =  the_td.parentElement;
        
var  the_table     =  get_Element(the_td, " table " );
        
var  i          =   0 ;
        clear_color();
        cur_row 
=  the_tr.rowIndex;
        cur_col 
=  the_td.cellIndex;
        
if (cur_row != 0 ){
            
for (i = 0 ;i < the_tr.cells.length;i ++ ){
                
with (the_tr.cells[i]){
                    style.backgroundColor
= cur_bgc;
                    style.color
= cur_fc;
                }
            }
        }
else {
            
if (show_col){
                
for (i = 1 ;i < the_table.rows.length;i ++ ){
                    
with (the_table.rows[i].cells[cur_col]){
                        style.backgroundColor
= cur_bgc;
                        style.color
= cur_fc;
                    }
                }
            }
            
            the_td.mode 
=   ! the_td.mode;
            
if (sort_col != null ){
                
with (the_table.rows[ 0 ].cells[sort_col])
                    removeChild(lastChild);
            }
            
with (the_table.rows[ 0 ].cells[cur_col])
                appendChild(the_td.mode
? arrowUp:arrowDown);
            sort_tab(the_table,cur_col,the_td.mode);
            sort_col
= cur_col;
        }
    }
}
function  dblclickIt(){
    event.cancelBubble
= true ;
    
if (cur_row != 0 ){
        
var  the_obj  =  event.srcElement;
        
if (the_obj.tagName.toLowerCase()  !=   " table "   &&  the_obj.tagName.toLowerCase()  !=   " tbody "   &&  the_obj.tagName.toLowerCase()  !=   " tr " ){
            
var  the_td     =  get_Element(the_obj, " td " );
            
if (the_td == null return ;
            cur_cell    
=  the_td;
            
if (the_td.children.length != 1 )
                the_td.innerHTML
= " <div> "   +  the_td.innerHTML  +   " </div> " ;
            
else   if (the_td.children.length == 1   &&  the_td.children[ 0 ].tagName.toLowerCase() != " div " )
                the_td.innerHTML
= " <div> "   +  the_td.innerHTML  +   " </div> " ;
            cur_cell.children[
0 ].contentEditable  =   true ;
            
with (cur_cell.children[ 0 ].runtimeStyle){
                borderRight
= borderBottom = " buttonhighlight 1px solid " ;
                borderLeft
= borderTop = " black 1px solid " ;
                backgroundColor
= " #dddddd " ;
                paddingLeft
= " 5px " ;
                
// textAlign="center";
            }
        }
    }
}
function  overIt(){
    
if (dragStart) return ;
    
var  the_obj  =  event.srcElement;
    
var  i  =   0 ;
    
if (the_obj.tagName.toLowerCase()  !=   " table " ){
        
var  the_td     =  get_Element(the_obj, " td " );
        
if (the_td == null return ;
        
var  the_tr     =  the_td.parentElement;
        
var  the_table     =  get_Element(the_td, " table " );
        
if (the_tr.rowIndex != 0 ){
            
for (i = 0 ;i < the_tr.cells.length;i ++ ){
                
with (the_tr.cells[i]){
                    runtimeStyle.backgroundColor
= act_bgc;
                    runtimeStyle.color
= act_fc;                    
                }
            }
        }
else {
            
for (i = 1 ;i < the_table.rows.length;i ++ ){
                
with (the_table.rows[i].cells(the_td.cellIndex)){
                    runtimeStyle.backgroundColor
= act_bgc;
                    runtimeStyle.color
= act_fc;
                }
            }
            
if (the_td.mode == undefined)the_td.mode  =   false ;
            the_td.style.cursor
= the_td.mode ? " n-resize " : " s-resize " ;
        }
    }
}
function  outIt(){
    
var  the_obj  =  event.srcElement;
    
var  i = 0 ;
    
if (the_obj.tagName.toLowerCase()  !=   " table " ){
        
var  the_td     =  get_Element(the_obj, " td " );
        
if (the_td == null return ;
        
var  the_tr     =  the_td.parentElement;
        
var  the_table     =  get_Element(the_td, " table " );
        
if (the_tr.rowIndex != 0 ){
            
for (i = 0 ;i < the_tr.cells.length;i ++ ){
                
with (the_tr.cells[i]){
                    runtimeStyle.backgroundColor
= '' ;
                    runtimeStyle.color
= '' ;                
                }
            }
        }
else {
            
var  the_table = the_tr.parentElement.parentElement;
            
for (i = 0 ;i < the_table.rows.length;i ++ ){
                
with (the_table.rows[i].cells(the_td.cellIndex)){
                    runtimeStyle.backgroundColor
= '' ;
                    runtimeStyle.color
= '' ;
                }
            }
        }
    }
}
var  charPYStr  =   " 啊阿埃挨哎唉哀皑癌蔼矮艾碍爱隘鞍氨安俺按暗岸胺案肮昂盎凹敖熬翱袄傲奥懊澳芭捌扒叭吧笆八疤巴拔跋靶把耙坝霸罢爸白柏百摆佰败拜稗斑班搬扳般颁板版扮拌伴瓣半办绊邦帮梆榜膀绑棒磅蚌镑傍谤苞胞包褒剥薄雹保堡饱宝抱报暴豹鲍爆杯碑悲卑北辈背贝钡倍狈备惫焙被奔苯本笨崩绷甭泵蹦迸逼鼻比鄙笔彼碧蓖蔽毕毙毖币庇痹闭敝弊必辟壁臂避陛鞭边编贬扁便变卞辨辩辫遍标彪膘表鳖憋别瘪彬斌濒滨宾摈兵冰柄丙秉饼炳病并玻菠播拨钵波博勃搏铂箔伯帛舶脖膊渤泊驳捕卜哺补埠不布步簿部怖擦猜裁材才财睬踩采彩菜蔡餐参蚕残惭惨灿苍舱仓沧藏操糙槽曹草厕策侧册测层蹭插叉茬茶查碴搽察岔差诧拆柴豺搀掺蝉馋谗缠铲产阐颤昌猖场尝常长偿肠厂敞畅唱倡超抄钞朝嘲潮巢吵炒车扯撤掣彻澈郴臣辰尘晨忱沉陈趁衬撑称城橙成呈乘程惩澄诚承逞骋秤吃痴持匙池迟弛驰耻齿侈尺赤翅斥炽充冲虫崇宠抽酬畴踌稠愁筹仇绸瞅丑臭初出橱厨躇锄雏滁除楚础储矗搐触处揣川穿椽传船喘串疮窗幢床闯创吹炊捶锤垂春椿醇唇淳纯蠢戳绰疵茨磁雌辞慈瓷词此刺赐次聪葱囱匆从丛凑粗醋簇促蹿篡窜摧崔催脆瘁粹淬翠村存寸磋撮搓措挫错搭达答瘩打大呆歹傣戴带殆代贷袋待逮怠耽担丹单郸掸胆旦氮但惮淡诞弹蛋当挡党荡档刀捣蹈倒岛祷导到稻悼道盗德得的蹬灯登等瞪凳邓堤低滴迪敌笛狄涤翟嫡抵底地蒂第帝弟递缔颠掂滇碘点典靛垫电佃甸店惦奠淀殿碉叼雕凋刁掉吊钓调跌爹碟蝶迭谍叠丁盯叮钉顶鼎锭定订丢东冬董懂动栋侗恫冻洞兜抖斗陡豆逗痘都督毒犊独读堵睹赌杜镀肚度渡妒端短锻段断缎堆兑队对墩吨蹲敦顿囤钝盾遁掇哆多夺垛躲朵跺舵剁惰堕蛾峨鹅俄额讹娥恶厄扼遏鄂饿恩而儿耳尔饵洱二贰发罚筏伐乏阀法珐藩帆番翻樊矾钒繁凡烦反返范贩犯饭泛坊芳方肪房防妨仿访纺放菲非啡飞肥匪诽吠肺废沸费芬酚吩氛分纷坟焚汾粉奋份忿愤粪丰封枫蜂峰锋风疯烽逢冯缝讽奉凤佛否夫敷肤孵扶拂辐幅氟符伏俘服浮涪福袱弗甫抚辅俯釜斧脯腑府腐赴副覆赋复傅付阜父腹负富讣附妇缚咐噶嘎该改概钙盖溉干甘杆柑竿肝赶感秆敢赣冈刚钢缸肛纲岗港杠篙皋高膏羔糕搞镐稿告哥歌搁戈鸽胳疙割革葛格蛤阁隔铬个各给根跟耕更庚羹埂耿梗工攻功恭龚供躬公宫弓巩汞拱贡共钩勾沟苟狗垢构购够辜菇咕箍估沽孤姑鼓古蛊骨谷股故顾固雇刮瓜剐寡挂褂乖拐怪棺关官冠观管馆罐惯灌贯光广逛瑰规圭硅归龟闺轨鬼诡癸桂柜跪贵刽辊滚棍锅郭国果裹过哈骸孩海氦亥害骇酣憨邯韩含涵寒函喊罕翰撼捍旱憾悍焊汗汉夯杭航壕嚎豪毫郝好耗号浩呵喝荷菏核禾和何合盒貉阂河涸赫褐鹤贺嘿黑痕很狠恨哼亨横衡恒轰哄烘虹鸿洪宏弘红喉侯猴吼厚候后呼乎忽瑚壶葫胡蝴狐糊湖弧虎唬护互沪户花哗华猾滑画划化话槐徊怀淮坏欢环桓还缓换患唤痪豢焕涣宦幻荒慌黄磺蝗簧皇凰惶煌晃幌恍谎灰挥辉徽恢蛔回毁悔慧卉惠晦贿秽会烩汇讳诲绘荤昏婚魂浑混豁活伙火获或惑霍货祸击圾基机畸稽积箕肌饥迹激讥鸡姬绩缉吉极棘辑籍集及急疾汲即嫉级挤几脊己蓟技冀季伎祭剂悸济寄寂计记既忌际妓继纪嘉枷夹佳家加荚颊贾甲钾假稼价架驾嫁歼监坚尖笺间煎兼肩艰奸缄茧检柬碱硷拣捡简俭剪减荐槛鉴践贱见键箭件健舰剑饯渐溅涧建僵姜将浆江疆蒋桨奖讲匠酱降蕉椒礁焦胶交郊浇骄娇嚼搅铰矫侥脚狡角饺缴绞剿教酵轿较叫窖揭接皆秸街阶截劫节茎睛晶鲸京惊精粳经井警景颈静境敬镜径痉靖竟竞净炯窘揪究纠玖韭久灸九酒厩救旧臼舅咎就疚鞠拘狙疽居驹菊局咀矩举沮聚拒据巨具距踞锯俱句惧炬剧捐鹃娟倦眷卷绢撅攫抉掘倔爵桔杰捷睫竭洁结解姐戒藉芥界借介疥诫届巾筋斤金今津襟紧锦仅谨进靳晋禁近烬浸尽劲荆兢觉决诀绝均菌钧军君峻俊竣浚郡骏喀咖卡咯开揩楷凯慨刊堪勘坎砍看康慷糠扛抗亢炕考拷烤靠坷苛柯棵磕颗科壳咳可渴克刻客课肯啃垦恳坑吭空恐孔控抠口扣寇枯哭窟苦酷库裤夸垮挎跨胯块筷侩快宽款匡筐狂框矿眶旷况亏盔岿窥葵奎魁傀馈愧溃坤昆捆困括扩廓阔垃拉喇蜡腊辣啦莱来赖蓝婪栏拦篮阑兰澜谰揽览懒缆烂滥琅榔狼廊郎朗浪捞劳牢老佬姥酪烙涝勒乐雷镭蕾磊累儡垒擂肋类泪棱楞冷厘梨犁黎篱狸离漓理李里鲤礼莉荔吏栗丽厉励砾历利傈例俐痢立粒沥隶力璃哩俩联莲连镰廉怜涟帘敛脸链恋炼练粮凉梁粱良两辆量晾亮谅撩聊僚疗燎寥辽潦了撂镣廖料列裂烈劣猎琳林磷霖临邻鳞淋凛赁吝拎玲菱零龄铃伶羚凌灵陵岭领另令溜琉榴硫馏留刘瘤流柳六龙聋咙笼窿隆垄拢陇楼娄搂篓漏陋芦卢颅庐炉掳卤虏鲁麓碌露路赂鹿潞禄录陆戮驴吕铝侣旅履屡缕虑氯律率滤绿峦挛孪滦卵乱掠略抡轮伦仑沦纶论萝螺罗逻锣箩骡裸落洛骆络妈麻玛码蚂马骂嘛吗埋买麦卖迈脉瞒馒蛮满蔓曼慢漫谩芒茫盲氓忙莽猫茅锚毛矛铆卯茂冒帽貌贸么玫枚梅酶霉煤没眉媒镁每美昧寐妹媚门闷们萌蒙檬盟锰猛梦孟眯醚靡糜迷谜弥米秘觅泌蜜密幂棉眠绵冕免勉娩缅面苗描瞄藐秒渺庙妙蔑灭民抿皿敏悯闽明螟鸣铭名命谬摸摹蘑模膜磨摩魔抹末莫墨默沫漠寞陌谋牟某拇牡亩姆母墓暮幕募慕木目睦牧穆拿哪呐钠那娜纳氖乃奶耐奈南男难囊挠脑恼闹淖呢馁内嫩能妮霓倪泥尼拟你匿腻逆溺蔫拈年碾撵捻念娘酿鸟尿捏聂孽啮镊镍涅您柠狞凝宁拧泞牛扭钮纽脓浓农弄奴努怒女暖虐疟挪懦糯诺哦欧鸥殴藕呕偶沤啪趴爬帕怕琶拍排牌徘湃派攀潘盘磐盼畔判叛乓庞旁耪胖抛咆刨炮袍跑泡呸胚培裴赔陪配佩沛喷盆砰抨烹澎彭蓬棚硼篷膨朋鹏捧碰坯砒霹批披劈琵毗啤脾疲皮匹痞僻屁譬篇偏片骗飘漂瓢票撇瞥拼频贫品聘乒坪苹萍平凭瓶评屏坡泼颇婆破魄迫粕剖扑铺仆莆葡菩蒲埔朴圃普浦谱曝瀑期欺栖戚妻七凄漆柒沏其棋奇歧畦崎脐齐旗祈祁骑起岂乞企启契砌器气迄弃汽泣讫掐洽牵扦钎铅千迁签仟谦乾黔钱钳前潜遣浅谴堑嵌欠歉枪呛腔羌墙蔷强抢橇锹敲悄桥瞧乔侨巧鞘撬翘峭俏窍切茄且怯窃钦侵亲秦琴勤芹擒禽寝沁青轻氢倾卿清擎晴氰情顷请庆琼穷秋丘邱球求囚酋泅趋区蛆曲躯屈驱渠取娶龋趣去圈颧权醛泉全痊拳犬券劝缺炔瘸却鹊榷确雀裙群然燃冉染瓤壤攘嚷让饶扰绕惹热壬仁人忍韧任认刃妊纫扔仍日戎茸蓉荣融熔溶容绒冗揉柔肉茹蠕儒孺如辱乳汝入褥软阮蕊瑞锐闰润若弱撒洒萨腮鳃塞赛三叁伞散桑嗓丧搔骚扫嫂瑟色涩森僧莎砂杀刹沙纱傻啥煞筛晒珊苫杉山删煽衫闪陕擅赡膳善汕扇缮墒伤商赏晌上尚裳梢捎稍烧芍勺韶少哨邵绍奢赊蛇舌舍赦摄射慑涉社设砷申呻伸身深娠绅神沈审婶甚肾慎渗声生甥牲升绳省盛剩胜圣师失狮施湿诗尸虱十石拾时什食蚀实识史矢使屎驶始式示士世柿事拭誓逝势是嗜噬适仕侍释饰氏市恃室视试收手首守寿授售受瘦兽蔬枢梳殊抒输叔舒淑疏书赎孰熟薯暑曙署蜀黍鼠属术述树束戍竖墅庶数漱恕刷耍摔衰甩帅栓拴霜双爽谁水睡税吮瞬顺舜说硕朔烁斯撕嘶思私司丝死肆寺嗣四伺似饲巳松耸怂颂送宋讼诵搜艘擞嗽苏酥俗素速粟僳塑溯宿诉肃酸蒜算虽隋随绥髓碎岁穗遂隧祟孙损笋蓑梭唆缩琐索锁所塌他它她塔獭挞蹋踏胎苔抬台泰酞太态汰坍摊贪瘫滩坛檀痰潭谭谈坦毯袒碳探叹炭汤塘搪堂棠膛唐糖倘躺淌趟烫掏涛滔绦萄桃逃淘陶讨套特藤腾疼誊梯剔踢锑提题蹄啼体替嚏惕涕剃屉天添填田甜恬舔腆挑条迢眺跳贴铁帖厅听烃汀廷停亭庭挺艇通桐酮瞳同铜彤童桶捅筒统痛偷投头透凸秃突图徒途涂屠土吐兔湍团推颓腿蜕褪退吞屯臀拖托脱鸵陀驮驼椭妥拓唾挖哇蛙洼娃瓦袜歪外豌弯湾玩顽丸烷完碗挽晚皖惋宛婉万腕汪王亡枉网往旺望忘妄威巍微危韦违桅围唯惟为潍维苇萎委伟伪尾纬未蔚味畏胃喂魏位渭谓尉慰卫瘟温蚊文闻纹吻稳紊问嗡翁瓮挝蜗涡窝我斡卧握沃巫呜钨乌污诬屋无芜梧吾吴毋武五捂午舞伍侮坞戊雾晤物勿务悟误昔熙析西硒矽晰嘻吸锡牺稀息希悉膝夕惜熄烯溪汐犀檄袭席习媳喜铣洗系隙戏细瞎虾匣霞辖暇峡侠狭下厦夏吓掀锨先仙鲜纤咸贤衔舷闲涎弦嫌显险现献县腺馅羡宪陷限线相厢镶香箱襄湘乡翔祥详想响享项巷橡像向象萧硝霄削哮嚣销消宵淆晓小孝校肖啸笑效楔些歇蝎鞋协挟携邪斜胁谐写械卸蟹懈泄泻谢屑薪芯锌欣辛新忻心信衅星腥猩惺兴刑型形邢行醒幸杏性姓兄凶胸匈汹雄熊休修羞朽嗅锈秀袖绣墟戌需虚嘘须徐许蓄酗叙旭序畜恤絮婿绪续轩喧宣悬旋玄选癣眩绚靴薛学穴雪血勋熏循旬询寻驯巡殉汛训讯逊迅压押鸦鸭呀丫芽牙蚜崖衙涯雅哑亚讶焉咽阉烟淹盐严研蜒岩延言颜阎炎沿奄掩眼衍演艳堰燕厌砚雁唁彦焰宴谚验殃央鸯秧杨扬佯疡羊洋阳氧仰痒养样漾邀腰妖瑶摇尧遥窑谣姚咬舀药要耀椰噎耶爷野冶也页掖业叶曳腋夜液一壹医揖铱依伊衣颐夷遗移仪胰疑沂宜姨彝椅蚁倚已乙矣以艺抑易邑屹亿役臆逸肄疫亦裔意毅忆义益溢诣议谊译异翼翌绎茵荫因殷音阴姻吟银淫寅饮尹引隐印英樱婴鹰应缨莹萤营荧蝇迎赢盈影颖硬映哟拥佣臃痈庸雍踊蛹咏泳涌永恿勇用幽优悠忧尤由邮铀犹油游酉有友右佑釉诱又幼迂淤于盂榆虞愚舆余俞逾鱼愉渝渔隅予娱雨与屿禹宇语羽玉域芋郁吁遇喻峪御愈欲狱育誉浴寓裕预豫驭鸳渊冤元垣袁原援辕园员圆猿源缘远苑愿怨院曰约越跃钥岳粤月悦阅耘云郧匀陨允运蕴酝晕韵孕匝砸杂栽哉灾宰载再在咱攒暂赞赃脏葬遭糟凿藻枣早澡蚤躁噪造皂灶燥责择则泽贼怎增憎曾赠扎喳渣札轧铡闸眨栅榨咋乍炸诈摘斋宅窄债寨瞻毡詹粘沾盏斩辗崭展蘸栈占战站湛绽樟章彰漳张掌涨杖丈帐账仗胀瘴障招昭找沼赵照罩兆肇召遮折哲蛰辙者锗蔗这浙珍斟真甄砧臻贞针侦枕疹诊震振镇阵蒸挣睁征狰争怔整拯正政帧症郑证芝枝支吱蜘知肢脂汁之织职直植殖执值侄址指止趾只旨纸志挚掷至致置帜峙制智秩稚质炙痔滞治窒中盅忠钟衷终种肿重仲众舟周州洲诌粥轴肘帚咒皱宙昼骤珠株蛛朱猪诸诛逐竹烛煮拄瞩嘱主著柱助蛀贮铸筑住注祝驻抓爪拽专砖转撰赚篆桩庄装妆撞壮状椎锥追赘坠缀谆准捉拙卓桌琢茁酌啄着灼浊兹咨资姿滋淄孜紫仔籽滓子自渍字鬃棕踪宗综总纵邹走奏揍租足卒族祖诅阻组钻纂嘴醉最罪尊遵昨左佐柞做作坐座 " ;
var  charBHStr  =   " 一乙丁七乃九了二人儿入八几刀刁力十卜厂又万丈三上下个丫丸久么义乞也习乡于亏亡亿凡刃勺千卫叉口土士夕大女子寸小尸山川工己已巳巾干广弓才门飞马不与丑专中丰丹为之乌书予云互五井亢什仁仅仆仇今介仍从仑仓允元公六内冈冗凤凶分切劝办勾勿匀化匹区升午卞厄厅历及友双反壬天太夫孔少尤尹尺屯巴币幻开引心忆戈户手扎支文斗斤方无日曰月木欠止歹毋比毛氏气水火爪父片牙牛犬王瓦艺见计订讣认讥贝车邓长队韦风且世丘丙业丛东丝主乍乎乏乐仔仕他仗付仙仟代令以仪们兄兰冉册写冬冯凸凹出击刊功加务包匆北匝卉半占卡卢卯厉去发古句另只叫召叭叮可台史右叶号司叹叼囚四圣处外央夯失头奴奶孕宁它对尔尼左巧巨市布帅平幼弗弘归必戊扑扒打扔斥旦旧未末本札术正母民永汀汁汇汉灭犯玄玉瓜甘生用甩田由甲申电白皮皿目矛矢石示礼禾穴立纠艾节讨让讫训议讯记轧边辽闪饥驭鸟龙丢乒乓乔买争亚交亥亦产仰仲件价任份仿企伊伍伎伏伐休众优伙会伞伟传伤伦伪充兆先光全共关兴再军农冰冲决刑划列刘则刚创劣动匈匠匡华协印危压厌吁吃各合吉吊同名后吏吐向吓吕吗回因团在圭地场圾壮多夷夸夹夺奸她好如妄妆妇妈字存孙宅宇守安寺寻导尖尘尧尽屹屿岁岂州巡巩帆师年并庄庆延廷异式弛当忙戌戍戎戏成托扛扣扦执扩扫扬收旨早旬旭曲曳有朱朴朵机朽杀杂权次欢此死毕氖汐汕汗汛汝江池污汤汲灯灰爷牟百祁竹米红纤约级纪纫网羊羽老考而耳肉肋肌臣自至臼舌舟色芋芍芒芝虫血行衣西观讲讳讶许讹论讼讽设访诀贞负轨达迁迂迄迅过迈邢那邦邪闭问闯阮防阳阴阵阶页驮驯驰齐两严串丽乱亨亩伯估伴伶伸伺似佃但位低住佐佑体何余佛作你佣克免兑兵况冶冷冻初删判刨利别助努劫励劲劳匣医卤即却卵县君吝吞吟吠否吧吨吩含听吭吮启吱吴吵吸吹吻吼吾呀呆呈告呐呕员呛呜囤园困囱围址均坊坍坎坏坐坑块坚坛坝坞坟坠声壳妊妒妓妖妙妥妨孜孝宋完宏寿尾尿局屁层岔岗岛希帐庇床序庐库应弃弄弟张形彤役彻忌忍志忘忧快忱忻怀我戒扭扮扯扰扳扶批扼找技抄抉把抑抒抓投抖抗折抚抛抠抡抢护报拒拟改攻旱时旷更杆杉李杏材村杖杜束杠条来杨极步歼每求汞汪汰汹汽汾沁沂沃沈沉沏沙沛沟没沤沥沦沧沪泛灵灶灸灼灾灿牡牢状犹狂狄狈玖玛甫男甸疗皂盯矣社秀私秃究穷系纬纯纱纲纳纵纶纷纸纹纺纽罕羌肖肘肚肛肝肠良芜芥芦芬芭芯花芳芹芽苇苍苏补角言证评诅识诈诉诊诌词译谷豆贡财赤走足身轩辛辰迎运近返还这进远违连迟邑邮邯邱邵邹邻酉里针钉闰闲间闷阻阿陀附际陆陇陈韧饭饮驱驳驴鸡麦龟丧乖乳事些享京佩佬佯佰佳使侄侈例侍侗供依侠侣侥侦侧侨侩兔其具典净凭凯函刮到制刷券刹刺刻刽剁剂势卑卒卓单卖卧卷厕叁参叔取呢周味呵呸呻呼命咀咆咋和咎咏咐咒咕咖咙哎固国图坡坤坦坪坯坷垂垃垄备夜奄奇奈奉奋奔妮妹妻姆始姐姑姓委孟季孤学宗官宙定宛宜宝实宠审尚居屈屉届岩岭岳岸岿巫帕帖帘帚帛帜幸底店庙庚府庞废建弥弦弧录彼往征径忠念忽忿态怂怔怕怖怜性怪怯或房所承抨披抬抱抵抹押抽抿拂拄担拆拇拈拉拌拍拎拐拓拔拖拘拙招拢拣拥拦拧拨择放斧斩旺昂昆昌明昏易昔朋服杭杯杰松板构枉析枕林枚果枝枢枣枪枫柜欣欧武歧殴氓氛沫沮河沸油治沼沽沾沿泄泅泊泌法泞泡波泣泥注泪泳泻泼泽浅炉炊炎炒炔炕炙炬爬爸版牧物狐狗狙狞玩玫环现瓮画畅疙疚疟疡的盂盲直知矽矾矿码祈秆秉空线练组绅细织终绊绍绎经罗者耶肃股肢肤肥肩肪肮肯育肺肾肿胀胁舍艰苑苔苗苛苞苟若苦苫苯英苹茁茂范茄茅茎虎虏虱表衫衬规觅视试诗诚诛话诞诡询诣该详诧责贤败账货质贩贪贫贬购贮贯转轮软轰迢迪迫迭述郁郊郎郑采金钎钒钓闸闹阜陋陌降限陕隶雨青非顶顷饯饰饱饲驶驹驻驼驾鱼鸣齿临举亭亮亲侮侯侵便促俄俊俏俐俗俘保俞信俩俭修兹养冒冠剃削前剐剑勃勇勉勋南卸厘厚受变叙叛咨咬咯咱咳咸咽哀品哄哆哇哈哉响哑哗哟哪型垒垛垢垣垦垫垮城复奎奏契奖姚姜姥姨姻姿威娃娄娇娜孩孪客宣室宦宪宫封将尝屋屎屏峙峡峦差巷帝带帧帮幽度庭弯彦彪待很徊律怎怒思怠急怨总恃恍恒恢恤恨恫恬恼战扁拜括拭拯拱拴拷拼拽拾持挂指按挎挑挖挝挞挟挠挡挣挤挥挪挺政故施既星映春昧昨昭是昼显枯架枷柄柏某柑柒染柔柞柠查柬柯柱柳柿栅标栈栋栏树歪殃殆残段毒毖毗毡氟氢泉泵洁洋洒洗洛洞津洪洱洲活洼洽派浇浊测济浑浓涎炭炮炯炳炸点炼炽烁烂烃牲牵狠狡独狭狮狰狱玲玻珊珍珐甚甭界畏疤疥疫疮疯癸皆皇盅盆盈相盼盾省眉看眨矩砂砌砍砒研砖砚祖祝神禹秋种科秒穿突窃竖竿类籽绑绒结绕绘给绚络绝绞统缸罚美耍耐胃胆背胎胖胚胜胞胡脉茧茨茫茬茵茶茸茹荆草荐荒荔荚荡荣荤荧荫药虐虹虽虾蚀蚁蚂蚤衍袄要览觉诫诬语误诱诲说诵贰贱贴贵贷贸费贺赴赵趴轴轻迷迸迹追退送适逃逆选逊郝郡郧酋重钙钝钞钟钠钡钢钥钦钧钨钩钮闺闻闽阀阁阂陛陡院除陨险面革韭音项顺须食饵饶饺饼首香骂骄骆骇骨鬼鸥鸦乘俯俱俺倍倒倔倘候倚借倡倦倪债值倾健党兼冤凄准凉凋凌剔剖剥剧匪匿卿原哥哦哨哩哭哮哲哺哼唁唆唇唉唐唤啊圃圆埂埃埋埔壶夏套姬娘娟娠娥娩娱宰害宴宵家容宽宾射屑展峨峪峭峰峻席座弱徐徒恋恐恕恩恭息恳恶悄悍悔悟悦悯扇拳拿挚挛挨挫振挽捂捅捆捉捌捍捎捏捐捕捞损捡换捣效敌敖斋料旁旅晃晋晌晒晓晕晚朔朗柴栓栖栗校株样核根格栽桂桃桅框案桌桐桑桓桔档桥桨桩梆梢梧梨殉殊殷毙氦氧氨泰流浆浙浚浦浩浪浮浴海浸涂涅消涉涌涕涛涝涟涡涣涤润涧涨涩烈烘烙烛烟烤烦烧烩烫烬热爱爹特牺狸狼珠班瓶瓷畔留畜疲疹疼疽疾病症痈痉皋皱益盎盏盐监真眠眩砧砰破砷砸砾础祟祥离秘租秤秦秧秩积称窄窍站竞笆笋笑笔粉紊素索紧绢绣绥绦继缺罢羔羞翁翅耕耗耘耙耸耻耽耿聂胯胰胳胶胸胺能脂脆脊脏脐脑脓臭致舀航般舰舱艳荷莆莉莎莫莱莲获莹莽虑蚊蚌蚕蚜衰衷袁袍袒袖袜被请诸诺读诽课谁调谅谆谈谊豹豺贼贾贿赁赂赃资赶起躬载轿较辱透逐递途逗通逛逝逞速造逢部郭郴郸都酌配酒釜钱钳钵钻钾铀铁铂铃铅铆阅陪陵陶陷难顽顾顿颁颂预饿馁骋验骏高鸭鸯鸳鸵乾假偏做停偶偷偿傀兜兽冕减凑凰剪副勒勘匙厢厩唬售唯唱唾啃啄商啡啤啥啦啪啮啸圈域埠培基堂堆堑堕堵够奢娶婆婉婚婪婴婶孰宿寂寄寅密寇尉屠崇崎崔崖崩崭巢常庶康庸廊弹彩彬得徘恿悉悠患您悬悸悼情惊惋惕惜惟惦惧惨惭惮惯戚捧据捶捷捻掀掂掇授掉掏掐排掖掘掠探接控推掩措掳掷掸掺敏救教敛敝敢斜断旋族晤晦晨曹曼望桶梁梅梗梦梭梯械梳检欲毫涪涯液涵涸淀淄淆淋淌淑淖淘淡淤淫淬淮深淳混淹添清渊渍渐渔渗渠烯烷烹烽焉焊焕爽犁猎猖猛猜猪猫率球琅理琉琐甜略畦疵痊痒痔痕皑盒盔盖盗盘盛眯眶眷眺眼着睁矫硅硒硕票祭祷祸秸移秽窑窒竟章笛符笨第笺笼粒粕粗粘累绩绪续绰绳维绵绷绸综绽绿缀羚翌聊聋职脖脚脯脱脸舵舶舷船菇菊菌菏菜菠菩菱菲萄萌萍萎萝萤营萧萨著虚蛀蛆蛇蛊蛋衅衔袋袭袱谋谍谎谐谓谗谚谜象赊赦趾跃距躯辅辆逮逸逻鄂酗酚酝酞野铜铝铡铣铬铭铰铱铲银阉阎阐隅隆隋随隐雀雪颅领颇颈馅馆骑鸽鸿鹿麻黄龚傅傈傍傣储傲凿剩割募博厦厨啼喀喂善喇喉喊喘喜喝喧喳喷喻堡堤堪堰塔壹奠奥婿媒媚嫂富寐寒寓尊就属屡嵌帽幂幅强彭御循悲惑惠惩惫惰惶惹惺愉愤愧慌慨掌掣揉揍描提插揖握揣揩揪揭援揽搀搁搂搅搓搔搜搭搽敞散敦敬斌斑斯普景晰晴晶智晾暂暑曾替最朝期棉棋棍棒棕棘棚棠森棱棵棺椅植椎椒椭椰榔欺款殖毯氮氯氰渝渡渣渤温渭港渴游渺湃湍湖湘湛湾湿溃溅溉滁滋滑滞焙焚焦焰然煮牌犀犊猩猴猾琢琳琴琵琶琼甥番畴疏痘痛痞痢痪登皖短硝硫硬确硷禄禽稀程稍税窖窗窘窜窝竣童等筋筏筐筑筒答策筛粟粤粥粪紫絮缄缅缆缉缎缓缔缕编缘羡翔翘联脾腆腊腋腑腔腕舒舜艇落葛葡董葫葬葱葵蒂蒋蛔蛙蛛蛤蛮蛰蜒街裁裂装裕裙裤谢谣谤谦赋赌赎赏赐赔趁超越趋跋跌跑践辈辉辊辜逼逾遁遂遇遍遏道遗酣酥釉释量铸铺链销锁锄锅锈锋锌锐锑阑阔隔隘隙雁雄雅集雇韩颊馈馋骗骚鲁鹃鹅黍黑鼎催傻像剿勤叠嗅嗓嗜嗡嗣塌塑塘塞填墓媳嫁嫉嫌寝寞幌幕廉廓微想愁愈意愚感慈慎慑搏搐搞搪搬携摄摆摇摈摊摸数斟新暇暖暗椽椿楔楚楞楷楼概榆槐歇歌殿毁源溜溢溪溯溶溺滇滓滔滚满滤滥滦滨滩漓漠煌煎煞煤照献猿瑚瑞瑟瑰甄畸痰痴痹瘁盟睛睡督睦睫睬睹瞄矮硼碉碌碍碎碑碗碘碰禁福稗稚稠窟窥筷筹签简粮粱粳缚缝缠罩罪置署群聘肄肆腥腮腰腹腺腻腾腿舅蒙蒜蒲蒸蓄蓉蓑蓖蓝蓟蓬虞蛹蛾蜂蜕蜗衙裔裸褂解触詹誉誊谨谩谬豢貉赖跟跨跪路跳跺躲辐辑输辞辟遣遥鄙酪酬酮酱鉴锗错锚锡锣锤锥锦锨锭键锯锰障雍雏零雷雹雾靖靳靴靶韵颐频颓颖馏魁魂鲍鹊鹏鼓鼠龄僚僧僳兢凳嗽嘉嘎嘘嘛境墅墒墙嫡嫩孵察寡寥寨廖弊彰愿慕慢慷截摔摘摧摹撂撇敲斡旗榜榨榴榷槛模歉滴漂漆漏演漫漱漳漾潍煽熄熊熏熔熙熬瑶璃疑瘟瘦瘩瞅碟碧碱碳碴磁磋稳竭端箍箔箕算管箩粹精缨缩翟翠聚肇腐膀膊膏膜舆舔舞蔑蔓蔗蔚蔡蔫蔷蔼蔽蜀蜘蜜蜡蝇蝉裳裴裹褐褪誓谭谰谱豪貌赘赚赛赫踊踌辕辖辗辣遭遮酵酶酷酸酿锹锻镀镁隧雌需静韶颗馒骡魄鲜鼻僵僻凛劈嘱嘲嘶嘻嘿噎噶增墟墨墩履幢影德慧慰憋憎憨懂戮摩撅撑撒撕撞撤撩撬播撮撰撵擒敷暮暴槽樊樟横樱橡毅潘潜潦潭潮澄澈澎澜澳熟瘤瘪瘫瞎瞒碾磅磊磐磕稻稼稽稿箭箱篆篇篓糊缮聪膘膛膝艘蔬蕉蕊蕴蝎蝗蝴蝶褒褥谴豌豫趟趣踏踞踢踩踪躺遵醇醉醋镇镊镍镐镑霄震霉靠鞋鞍题颜额飘骸鲤鹤黎儒冀凝嘴器噪噬壁憾懈懊懒撼擂擅操擎擞整橇橙橱潞澡激濒燃燎燕獭瓢瘴瘸瞥磨磺穆窿篙篡篮篱篷糕糖糙缴翰翱耪膨膳臻蕾薄薛薪薯融螟衡赞赠蹄辙辨辩避邀醒醚醛镜雕霍霓霖靛鞘颠餐鲸黔默儡嚎嚏壕孺徽懦戴擦曙檀檄檬燥爵癌瞧瞩瞪瞬瞳磷礁穗簇簧糜糟糠繁翼臀臂臃臆藉藏藐螺襄豁赡赢蹈蹋辫镣霜霞鞠骤魏鳃龋嚣彝戳瀑瞻翻藕藤藩襟覆蹦躇镭镰鞭鬃鹰孽攀攒曝爆瓣疆癣簿羹藻蘑蟹警蹬蹭蹲蹿靡颤鳖麓嚷嚼壤巍攘灌籍糯纂耀蠕譬躁魔鳞蠢赣露霸霹髓囊瓤蘸镶攫罐颧矗 " ;
function  judge_CN(char1,char2,mode){
    
var  charSet = charMode ? charBHStr:charPYStr;
    
for ( var  n = 0 ;n < (char1.length > char2.length ? char1.length:char2.length);n ++ ){
        
if (char1.charAt(n) != char2.charAt(n)){
            
if (mode)  return (charSet.indexOf(char1.charAt(n)) > charSet.indexOf(char2.charAt(n)) ? 1 : - 1 );
            
else       return (charSet.indexOf(char1.charAt(n)) < charSet.indexOf(char2.charAt(n)) ? 1 : - 1 );
            
break ;
        }
    }
    
return ( 0 );
}
function  sort_tab(the_tab,col,mode){
    
var  tab_arr  =   new  Array();
    
var  i;
    
var  start = new  Date;
    
for (i = 1 ;i < the_tab.rows.length;i ++ ){
        tab_arr.push(
new  Array(the_tab.rows[i].cells[col].innerText.toLowerCase(),the_tab.rows[i]));
    }
    
function  SortArr(mode) {
        
return   function  (arr1, arr2){
            
var  flag;
            
var  a,b;
            a 
=  arr1[ 0 ];
            b 
=  arr2[ 0 ];
            
if ( /^ ( +|- ) ? d + ($ | .d + $) / .test(a)  &&   /^ ( +|- ) ? d + ($ | .d + $) / .test(b)){
                a
= eval(a);
                b
= eval(b);
                flag
= mode ? (a > b ? 1 :(a < b ?- 1 : 0 )):(a < b ? 1 :(a > b ?- 1 : 0 ));
            }
else {
                a
= a.toString();
                b
= b.toString();
                
if (a.charCodeAt( 0 ) >= 19968   &&  b.charCodeAt( 0 ) >= 19968 ){
                    flag 
=  judge_CN(a,b,mode);
                }
else {
                    flag
= mode ? (a > b ? 1 :(a < b ?- 1 : 0 )):(a < b ? 1 :(a > b ?- 1 : 0 ));
                }
            }
            
return  flag;
        };
    }
    tab_arr.sort(SortArr(mode));
    
    
for (i = 0 ;i < tab_arr.length;i ++ ){
        the_tab.lastChild.appendChild(tab_arr[i][
1 ]);
    }
    
/*
    for(i=0;i<tab_arr.length;i++){
        the_tab.rows[i+1].swapNode(tab_arr[i][1]);
    }
    
====================================================================================
//    tab_arr.push(new Array(the_tab.rows[i].cells[col].innerText.toLowerCase(),i));
    
    for(i=0;i<tab_arr.length;i++){
        the_tab.insertRow(-1);
        the_tab.rows[the_tab.rows.length-1].style.display="none";
        change_row(the_tab,tab_arr[i][1],the_tab.rows.length-1);
    }
    for(i=0;i<tab_arr.length;i++){
        the_table.deleteRow(1);
    }
    
====================================================================================    tab_arr=(new Array(new Array(0,0))).concat(tab_arr);
    var temp = 1;
    var change_line=1;
    for(i=1;i<tab_arr.length;i++){
        //alert(tab_arr[temp][1] + ' - ' + temp)
        if(tab_arr[temp][1] != change_line){
            change_row(the_tab,tab_arr[temp][1],temp);
            tab_arr[temp][2] = true;
            temp = tab_arr[temp][1];
        }else{
            alert(change_line);
        }
    }
*/
    window.status 
=   "  (Time spent:  "   +  ( new  Date  -  start)  +   " ms) " ;
}
function  change_row(the_tab,line1,line2){
    the_tab.rows[line1].swapNode(the_tab.rows[line2])
}
function  change_col(the_tab,line1,line2){
    
for ( var  i = 0 ;i < the_tab.rows.length;i ++ )
        the_tab.rows[i].cells[line1].swapNode(the_tab.rows[i].cells[line2]);
}
function  Move_up(the_table){
    event.cancelBubble
= true ;
    
if (cur_row == null   ||  cur_row <= 1 ) return ;
    change_row(the_table,cur_row,
-- cur_row);
}
function  Move_down(the_table){
    event.cancelBubble
= true ;
    
if (cur_row == null   ||  cur_row == the_table.rows.length - 1   ||  cur_row == 0 ) return ;
    change_row(the_table,cur_row,
++ cur_row);
}
function  Move_left(the_table){
    event.cancelBubble
= true ;
    
if (cur_col == null   ||  cur_col == 0 ) return ;
    change_col(the_table,cur_col,
-- cur_col);
    
if (cur_col == sort_col)sort_col = cur_col + 1 ;
    
else   if (cur_col + 1 == sort_col)sort_col = cur_col;
}
function  Move_right(the_table){
    event.cancelBubble
= true ;
    
if (cur_col == null   ||  cur_col == the_table.rows[ 0 ].cells.length - 1 ) return ;
    change_col(the_table,cur_col,
++ cur_col);
    
if (cur_col == sort_col)sort_col = cur_col - 1 ;
    
else   if (cur_col - 1 == sort_col)sort_col = cur_col;
}
function  add_row(the_table) {
    event.cancelBubble
= true ;
    
var  the_row,the_cell;
    the_row 
=  cur_row == null ?- 1 :(cur_row + 1 );
    clear_color();
    
var  newrow = the_table.insertRow(the_row);
    
for  ( var  i = 0 ;i < the_table.rows[ 0 ].cells.length;i ++ ) {
        the_cell
= newrow.insertCell(i);
        the_cell.innerText
= " NewRow_ "   +  the_cell.parentElement.rowIndex;
    }
    read_def(the_table);
}
function  del_row(the_table) {
    
if (the_table.rows.length == 1 return ;
    
var  the_row;
    the_row 
=  (cur_row == null   ||  cur_row == 0 ) ?- 1 :cur_row;
    the_table.deleteRow(the_row);
    cur_row 
=   null ;
    cur_cell
= null ;
}
function  add_col(the_table) {
    event.cancelBubble
= true ;
    
var  the_col,i,the_cell;
    the_col 
=  cur_col == null ?- 1 :(cur_col + 1 );
    
var  the_title = prompt( " Please input the title:  " , " Untitled " );
    
if (the_title == null ) return ;
    
if (the_col !=- 1   &&  the_col <= sort_col  &&  sort_col != null )sort_col ++ ;
    the_title
= the_title == "" ? " Untitled " :the_title
    clear_color();
    
for ( var  i = 0 ;i < the_table.rows.length;i ++ ){
        the_cell
= the_table.rows[i].insertCell(the_col);
        the_cell.innerText
= i == 0 ? the_title:( " NewCol_ "   +  the_cell.cellIndex);
    }
    read_def(the_table);
}
function  del_col(the_table) {
    
if (the_table.rows[ 0 ].cells.length == 1 return ;
    
var  the_col,the_cell;
    the_col 
=  cur_col == null ? (the_table.rows[ 0 ].cells.length - 1 ):cur_col;
    
if (the_col !=- 1   &&  the_col < sort_col  &&  sort_col != null )sort_col -- ;
    
else   if (the_col == sort_col)sort_col = null ;
    
for ( var  i = 0 ;i < the_table.rows.length;i ++ ) the_table.rows[i].deleteCell(the_col);
    cur_col 
=   null ;
    cur_cell
= null ;
}
function  res_tab(the_table){
    the_table.outerHTML
= Org_con;
    init();
}
function  exp_tab(the_table){
    
var  the_content = "" ;
    document.onclick();
    the_content
= the_table.outerHTML;
    the_content
= the_content.replace( /  style = " [^"]*"/g, "" );
    the_content=the_content.replace(/ mode="(false|true)
" / g, "" );
    the_content
= the_content.replace( /  oBgc = " [w#d]*"/g, "" );
    the_content=the_content.replace(/ oFc="[w#d]*"/g,
"" );
    the_content=the_content.replace(/<span>(5|6)</span>/gi,
"" );
    the_content=the_content.replace(/<DIV contentEditable=false>(.*)</DIV>/ig,
" $ 1 " );
    the_content=
" < style > table{font - size: 9pt;word - break : break - all;cursor:  default ;BORDER: black 1px solid;background - color:#eeeecc;border - collapse:collapse;border - Color:# 999999 ;align:center;} </ style > " +the_content;
    var newwin=window.open(
" about:blank " , " _blank " , "" );
    newwin.document.open();
    newwin.document.write(the_content);
    newwin.document.close();
    newwin=null;
}
</script>
<TABLE width=100% border=1 cellSpacing=0 cellPadding=2 id=
" PowerTable " >
<TR align=middle bgColor=#ffcc00>
<TD>First Name</TD>
<TD>Last Name</TD>
<TD>Team</TD>
<TD>Engine</TD>
<TD>Tyres</TD>
<TD>Fastest Lap</TD>
<TD>国家</TD></TR>
<TR>
<TD>Michael</TD>
<TD>Schumacher</TD>
<TD>Ferrari</TD>
<TD>Ferrari</TD>
<TD>Bridgestone</TD>
<TD>1.15.872</TD>
<TD>德国</TD></TR>
<TR>
<TD>Rubens</TD>
<TD>Barrichello</TD>
<TD>Ferrari</TD>
<TD>Ferrari</TD>
<TD>Bridgestone</TD>
<TD>1.16.760</TD>
<TD>法国</TD></TR>
<TR>
<TD>Ralph</TD>
<TD>Schumacher</TD>
<TD>Williams</TD>
<TD>BMW</TD>
<TD>Michelin</TD>
<TD>1.16.297</TD>
<TD>美国</TD></TR>
<TR>
<TD>Juan-Pablo</TD>
<TD>Montoya</TD>
<TD>Williams</TD>
<TD>BMW</TD>
<TD>Michelin</TD>
<TD>1.17.123</TD>
<TD>柬埔寨</TD></TR>
<TR>
<TD>David</TD>
<TD>Coulthard</TD>
<TD>McLaren</TD>
<TD>Mercedes</TD>
<TD>Bridgestone</TD>
<TD>1.16.423</TD>
<TD>泰国</TD></TR>
<TR>
<TD>Mika</TD>
<TD>Hakkinen</TD>
<TD>McLaren</TD>
<TD>Mercedes</TD>
<TD>Bridgestone</TD>
<TD>1.16.979</TD>
<TD>越南</TD></TR>
<TR>
<TD>Jarno</TD>
<TD>Trulli</TD>
<TD>Jordan</TD>
<TD>Honda</TD>
<TD>Bridgestone</TD>
<TD>1.16.459</TD>
<TD>菲律宾</TD></TR>
<TR>
<TD>Ricardo</TD>
<TD>Zonta</TD>
<TD>Jordan</TD>
<TD>Honda</TD>
<TD>Bridgestone</TD>
<TD>1.17.328</TD>
<TD>英国</TD></TR>
<TR>
<TD>Olivia</TD>
<TD>Panis</TD>
<TD>BAR</TD>
<TD>Honda</TD>
<TD>Bridgestone</TD>
<TD>1.16.771</TD>
<TD>蒙古</TD></TR>
<TR>
<TD>Jacques</TD>
<TD>Villeneuve</TD>
<TD>BAR</TD>
<TD>Honda</TD>
<TD>Bridgestone</TD>
<TD>1.17.035</TD>
<TD>马来西亚</TD></TR>
<TR>
<TD>Kimi</TD>
<TD>Raikkonen</TD>
<TD>Sauber</TD>
<TD>Petronas</TD>
<TD>Bridgestone</TD>
<TD>1.16.875</TD>
<TD>缅甸</TD></TR>
<TR>
<TD>Nick</TD>
<TD>Heidfeld</TD>
<TD>Sauber</TD>
<TD>Petronas</TD>
<TD>Bridgestone</TD>
<TD>1.17.165</TD>
<TD>朝鲜</TD></TR>
<TR>
<TD>Eddie</TD>
<TD>Irvine</TD>
<TD>Jaguar</TD>
<TD>Cosworth</TD>
<TD>Michelin</TD>
<TD>1.18.016</TD>
<TD>中国</TD></TR>
<TR>
<TD>Pedro</TD>
<TD>de la Rosa</TD>
<TD>Jaguar</TD>
<TD>Cosworth</TD>
<TD>Michelin</TD>
<TD>1.18.015</TD>
<TD>俄罗斯</TD></TR>
<TR>
<TD>Hugh</TD>
<TD>Gengine</TD>
<TD>Lotus</TD>
<TD>Renault</TD>
<TD>Michelin</TD>
<TD>1.15.015</TD>
<TD>韩国</TD></TR>
<TR>
<TD>Gloria</TD>
<TD>Slap</TD>
<TD>Lotus</TD>
<TD>Renault</TD>
<TD>Michelin</TD>
<TD>1.15.012</TD>
<TD>日本</TD></TR>
</TABLE>
<p>
<input type=button value=ins_row οnclick=add_row(Main_Tab)>
<input type=button value=ins_col οnclick=add_col(Main_Tab)>
<input type=button value=Del_row οnclick=del_row(Main_Tab)>
<input type=button value=Del_col οnclick=del_col(Main_Tab)>
<input type=button value=Restore οnclick=res_tab(Main_Tab)>
<input type=button value=Export  οnclick=exp_tab(Main_Tab)>
 ( Move: 
<input type=button id=move value=Up    οnclick=Move_up(Main_Tab)>
<input type=button id=move value=Down  οnclick=Move_down(Main_Tab)>
<input type=button id=move value=Left  οnclick=Move_left(Main_Tab)>
<input type=button id=move value=Right οnclick=Move_right(Main_Tab)> )
汉字排序:
<select id=sel_Mode οnchange=
" charMode = this .selectedIndex " >
<option>拼音
<option>笔画
</select>
<span style=
" cursor:hand; color: red; text - Decoration: underline "  οnclick= " if (detail.style.display == '' ){detail.style.display = ' none ' ; this .innerText = ' Show Detail ' } else {detail.style.display = '' ; this .innerText = ' Hide Detail ' } " >Show Detail</span>
</p>
<div id=detail style=
" display:none " >
<input type=text id=monitor size=30 style=
" width:200px " >
<br>
<textarea id=showContent cols=100 rows=20></textarea>
</div>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
点击表头即可实现排序的代码./*table排序步骤 1、给排序表格加id 2、标题栏加<thead> 3、排序的内容加<tbody> 5、引入此js 6、在文档的末尾加入 [removed] var to = new TableOrder("idTable"), odID = to.creat({ type: "int", desc: false }), arrOrder = []; $$A.forEach([ ["idNum", { type: "int" }],//排序对象(对应列的id) ["idTitle", { index: 1 }], ["idExt", { index: 1, property: "_ext" }], ["idAddtime", { index: 2, type: "date" }], ["idSize", { index: 3, property: "_order", type: "int" }], ["idCheckbox", { index: 4, type: "bool", value: SetCheck }], ["idRadio", { index: 5, type: "bool", value: SetCheck }] ], function (arr){ var o = $$(arr[0]), order = to.creat(arr[1]); order.onBegin = function(){ ClearCss(); odID.desc = this.desc; } order.onEnd = function(){ o.className = this.desc ? "desc" : "asc";//设置样式 this.desc = !this.desc;//取反排序 } o.onclick = function(){ to.sort(order, odID); } arrOrder.push(o);//记录排序项目(这里主要用来设置样式) }); [removed] 7、【排序对象】 属性 默认值//说明 index: 0,//td索引 property: "innerHTML",//获取数据的属性 type: "string",//比较的数据类型 desc: true,//是否按降序 compare: null,//自定义排序函数 value: null,//自定义取值函数 repair: this._repair,//是否解决checkbox和radio状态恢复bug onBegin: function(){},//排序前执行 onEnd: function(){}//排序后执行 */ //完整的示例 //<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> //<html> //<head> //<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> //<title>Table 排序</title> //[removed][removed] //</head> //<body> //<style type="text/css"> //.odTable {width:500px;border:1px solid #ebebeb;line-height:20px;font-size:12px;background:#FFF;} //.odTable thead {background-color:#ebebeb;} //.odTable span {color:#333;padding-right:15px;cursor:pointer;} //.odTable .desc, .odTable .asc {background:url(http://images.cnblogs.com/cnblogs_com/cloudgamer/169629/r_2.jpg) right center no-repeat;} //.odTable .desc {background-image:url(http://images.cnblogs.com/cnblogs_com/cloudgamer/169629/r_1.jpg);} //</style> //<table border="0" cellspacing="0" cellpadding="5" class="odTable" id="idTable"> // <thead> // <tr> // <td align="center"><span id="idNum">ID</span></td> // <td> <span id="idTitle">名称</span> / <span id="idExt">类型</span></td> // <td width="100" align="center"><span id="idAddtime">上传时间</span></td> // <td width="50" align="center"><span id="idSize">大小</span></td> // <td width="30" align="center"><span id="idCheckbox">C</span></td> // <td width="30" align="center"><span id="idRadio">R</span></td> // </tr> // </thead> // <tbody> // <tr> // <td align="center">1</td> // <td _ext="htm">new.htm</td> // <td align="center">2008/9/12</td> // <td align="right" _order="433244">423.09 K</td> // <td align="center"><input type="checkbox"/></td> // <td align="center"><input name="c" type="radio"/></td> // </tr> // <tr> // <td align="center">2</td> // <td _ext="js">Scroller.js</td> // <td align="center">2008/9/23</td> // <td align="right" _order="2560">2.5 K</td> // <td align="center"><input type="checkbox"/></td> // <td align="center"><input name="c" type="radio"/></td> // </tr> // <tr> // <td align="center">3</td> // <td _ext="js">AlertBox.js</td> // <td align="center">2008/9/23</td> // <td align="right" _order="3563">3.48 K</td> // <td align="center"><input type="checkbox"/></td> // <td align="center"><input name="c" type="radio"/></td> // </tr> // <tr> // <td align="center">4</td> // <td _ext="xml">1.xml</td> // <td align="center">2008/10/4</td> // <td align="right" _order="11397">11.13 K</td> // <td align="center"><input type="checkbox"/></td> // <td align="center"><input name="c" type="radio"/></td> // </tr> // <tr> // <td align="center">5</td> // <td _ext="xml">4.xml</td> // <td align="center">2008/10/4</td> // <td align="right" _order="108">108 b</td> // <td align="center"><input type="checkbox"/></td> // <td align="center"><input name="c" type="radio"/></td> // </tr> // <tr> // <td align="center">6</td> // <td _ext="htm">news.htm</td> // <td align="center">2008/10/4</td> // <td align="right" _order="14074">13.74 K</td> // <td align="center"><input type="checkbox"/></td> // <td align="center"><input name="c" type="radio"/></td> // </tr> // <tr> // <td align="center">7</td> // <td _ext="js">function.js</td> // <td align="center">2008/10/4</td> // <td align="right" _order="2844">2.78 K</td> // <td align="center"><input type="checkbox"/></td> // <td align="center"><input name="c" type="radio"/></td> // </tr> // <tr> // <td align="center">8</td> // <td _ext="mp3">神秘园 - Nocturne.mp3</td> // <td align="center">2008/9/20</td> // <td align="right" _order="3111293">2.97 M</td> // <td align="center"><input type="checkbox"/></td> // <td align="center"><input name="c" type="radio"/></td> // </tr> // <tr> // <td align="center">9</td> // <td _ext="doc">详细功略+剧情流程(一).doc</td> // <td align="center">2009/2/2</td> // <td align="right" _order="63488">62 K</td> // <td align="center"><input type="checkbox"/></td> // <td align="center"><input name="c" type="radio"/></td> // </tr> // <tr> // <td align="center">10</td> // <td _ext="doc">详细功略+剧情流程(二).doc</td> // <td align="center">2009/2/2</td> // <td align="right" _order="164352">160.5 K</td> // <td align="center"><input type="checkbox"/></td> // <td align="center"><input name="c" type="radio"/></td> // </tr> // </tbody> //</table> //<br /> //有中文的先排前面,再按时间倒序,ID倒序排序: //<input name="" type="button" value="Sort" id="idBtn" /> //[removed] //var to = new TableOrder("idTable"), odID = to.creat({ type: "int", desc: false }), arrOrder = []; //$$A.forEach([ // ["idNum", { type: "int" }], // ["idTitle", { index: 1 }], // ["idExt", { index: 1, property: "_ext" }], // ["idAddtime", { index: 2, type: "date" }], // ["idSize", { index: 3, property: "_order", type: "int" }], // ["idCheckbox", { index: 4, type: "bool", value: SetCheck }], // ["idRadio", { index: 5, type: "bool", value: SetCheck }] //], function (arr){ // var o = $$(arr[0]), order = to.creat(arr[1]); // order.onBegin = function(){ ClearCss(); odID.desc = this.desc; } // order.onEnd = function(){ // o.className = this.desc ? "desc" : "asc";//设置样式 // this.desc = !this.desc;//取反排序 // } // o.onclick = function(){ to.sort(order, odID); } // arrOrder.push(o);//记录排序项目(这里主要用来设置样式) //}); //$$("idNum").onclick(); //////////////////////////////////////////////////////////////////////// //var od1 = to.creat({ index: 1, onEnd: ClearCss, // compare: function(value1, value2) { // var re = /[\u4E00-\u9FA5]/, v1 = re.test(value1), v2 = re.test(value2); // return v1 == v2 ? 0 : (v1 ? 1 : -1); // } // }) // ,od2 = to.creat({ index: 2, type: "date" }) ,od3 = to.creat({ type: "int" }); //$$("idBtn").onclick = function(){ to.sort(od1, od2, od3); } //[removed] //</body> //</html>
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值