当前位置: 首页 > 图文教程 > 网络编程 > Javascript > 排序Select中Option项的一个示例

Javascript
js 判断 enter 事件
谷歌浏览器 insertCell与appendChild的区别
从JavaScript 到 JQuery (1)学习小结
JavaScript实现动态增加文件域表单
JavaScript DOM 添加事件
Javascript 跨域访问解决方案
检测是否已安装 .NET Framework 3.5的js脚本
JavaScript 获得选中文本内容的方法
Javascript 获取链接(url)参数的方法
javascript Ext JS 状态默认存储时间
动态为事件添加js代码示例
JSON扫盲帖 JSON.as类教程
JavaScript 全面解析各种浏览器网页中的JS 执行顺序
js实现权限树的更新权限时的全选全消功能
javascript Table 中2个列(TD)的交换实现代码
js表数据排序 sort table data
javascript css在IE和Firefox中区别分析
JAVASCRIPT IE 与 FF中兼容问题小结
判断多个元素(RADIO,CHECKBOX等)是否被选择的原理说明
csdn 批量接受好友邀请

Javascript 中的 排序Select中Option项的一个示例


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-08-10   浏览: 515 ::
收藏到网摘: n/a

Form中的Select控件不支持对选择项(Option)的排序,下面我将对Option中value属性值进行排序,并调整每个Option排序后的位置,具体代码如下(这里假设每个Option中的value与其中的text内容相同):

该函数运用了Array(数组)对象的排序(sort)方法,实现了Select排序。

function sortMe(oSel){
var ln = oSel.options.length;
var arr = new Array(); // 这是关键部分

// 将select中的所有option的value值将保存在Array中
for (var i = 0; i < ln; i++)
{

  // 如果需要对option中的文本排序,可以改为arr[i] = oSel.options[i].text;
  arr[i] = oSel.options[i].value;

}

arr.sort(); // 开始排序

// 清空Select中全部Option

while (ln--)
{
  oSel.options[ln] = null;
}

// 将排序后的数组重新添加到Select中

for (i = 0; i < arr.length; i++)
{
  oSel.add (new Option(arr[i], arr[i]));
}
}
</script>

下面的示例演示了一个按升序排序的select