自动对select表单列表进行排序(收藏)

Posted on 2007-03-22 15:55 Jaunt 阅读(490) 评论(0)  编辑  收藏 所属分类: JavaScript
自动对select表单列表进行排序

<! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>runcode</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="Author" content="Sheneyan" />
<script type="text/javascript">
function s(n){
  var o=document.getElementById(n);
  if (!o) return ;
  var t=[],tt=o.options;
  while(tt.length>0){
  t[t.length]=tt[0].text;
  tt.remove(0);
 }
 t.sort();
  for(var i=0,c;c=t[i];i++){
  tt.add(new Option(c));
 }
}
</script>
</head>
<body onload="s('abc')">
<select id="abc">
<option>华硕</option>
<option>.NET </option>
<option>360 安全卫士</option>
<option>ACDSee</option>
<option>Adobe</option>
<option>Firewall</option>
<option>Alcohol 120%</option>
<option>AMD</option>
<option>AnyDVD</option>
<option>Apple</option>
<option>ATi</option>
<option>AutoDesk</option>
<option>罗技</option>
<option>BitComet</option>
<option>BitSpirit(比特精灵)</option>
<option>BlackIce</option>
<option>BlueTooth</option>
<option>Cisco </option>
<option>CloneCD</option>
<option>CloneDVD</option>
<option>CS-半条命</option>
<option>CuteFTP</option>
<option>千千静听</option>
<option>趋势科技(PC-cillin)</option>
<option>DAEMON Tools</option>
<option>DELL</option>
<option>DirectX</option>
<option>DivX</option>
<option>DreamMail</option>
<option>PowerDVD</option>
<option>Easy CD-DA</option>
<option>瑞星(Rising)</option>
<option>Editplus</option>
<option>EmEditor</option>
<option>eMule</option>
<option>eMule Plus</option>
<option>FeedDemon</option>
<option>FileZilla</option>
<option>FlashFXP</option>
<option>Flashget</option>
<option>foobar2000</option>
<option>Foxit PDF Reader</option>
<option>Foxmail</option>
<option>FreeBSD</option>
<option>FTPRush</option>
<option>Gmail</option>
<option>Google talk</option>
<option>Google</option>
<option>GoogleToolbar</option>
<option>GoSURF</option>
<option>GreenBrowser</option>
<option>HP</option>
<option>HyperSnap-DX</option>
<option>IBM</option>
<option>ICQ</option>
<option>iMac G5</option>
<option>Intel</option>
<option>Internet Explorer</option>
<option>IPB</option>
<option>iTune</option>
<option>腾讯</option>
<option>微软</option>
<option>木马克星(iparmor)</option>
<option>天网防火墙</option>
<option>木马捆绑克星</option>
<option>风云防火墙个人版</option>
<option>卡巴斯基(Kaspersky)</option>
<option>Maxthon 傲游</option>
<option>Media Player Classic</option>
<option>Windows Media Player</option>
<option>Windows Live Messenger</option>
<option>Microsoft AntiSpyware</option>
<option>Microsoft Office</option>
<option>Mozilla FireFox</option>
<option>Mozilla ThunderBird</option>
<option>MySQL</option>
<option>Nero</option>
<option>NetCaptor</option>
<option>Nettransport</option>
<option>nVIDIA nForce</option>
<option>鱼鱼桌面秀</option>
<option>Opera</option>
<option>PHP</option>
<option>QQ病毒专杀工具</option>
<option>QuickTime</option>
<option>RealPlayer</option>
<option>skype</option>
<option>SQL Server 2005</option>
<option>stylexp</option>
<option>TheWorld Browser</option>
<option>TuneUp Utilities</option>
<option>UltraEdit</option>
<option>UltraISO</option>
<option>Winamp</option>
<option>Windows OneCare</option>
<option>Windows优化王</option>
<option>Windows优化大师</option>
<option>WinDVD</option>
<option>WinRAR</option>
<option>WinZip</option>
<option>XnView</option>
<option>Zonealarm</option>
<option>Zoom Player</option>
<option>超级兔子</option>
<option>风雷影音</option>
<option>急速启动 HurryRun</option>
</select>
</body>
</html>

主要有以下几点总结:
1,select控件本身支持字母索引。比如select控件处于焦点中的时候,按B键,option中相应的以B开头的选项就会显示出来。

2,这段代码写的较好!这段代码的作用是一项一项赋值select空间列表内容赋给另一个数组。
var t=[],tt=o.options;
  
while (tt.length>0){
    t[t.length]
=tt[0].text;
    tt.remove(
0);
  }

首先定义数组t=[],用于存储原select控件列表内容。
tt=o.options;读取select空间内容,以数组形式存储在tt数组中。
t[t.length]=tt[0].text;这里时一个技巧,因为t.length总是比当前t的最大索引大1,所以这样写数组t可以自动增加空间。tt[0].text这里每次都读取第一个内容,然后用tt.remove(0);删除第一项内容,直至读取完毕。

3,这段代码对新数组内容按字母派讯,然后写入原select空间列表。
t.sort();
  for (var i=0,c;c=t[i];i++){
    tt.add(
new Option(c));
  }


From Index:http://www.cnitblog.com/yemoo/archive/2006/06/20/12573.html

只有注册用户登录后才能发表评论。


网站导航: