javascript高级的文件目录排序代码

刚写完,欢迎大家帮忙测试
完整的测试代码:

高级目录,文件名排序

#page{}

高级目录,文件名排序

主要实现了目录中的数字按大小排序

排序结果:

//accepts a string; returns the string with regex metacharacters escaped. the returned string
// can safely be used at any point within a regex to match the provided literal string. escaped
// characters are [, ], {, }, (, ), -, *, +, ?, ., \, ^, $, |, #, , and whitespace
RegExp.escape = function (str) {
return str.replace(/[-[\]{}()*+?.\\^$|,#\s]/g, "\\$&");
};
var fileSort=function(arr,getVal){
var res=[],temp=[],i=0,j=0,k,reg,item,cur;
getVal=getVal || function(a){return a};
arr.sort(function(a,b){
return getVal(a).localeCompare(getVal(b));
});
for(;i0){
temp.sort(function(a,b){
return parseInt(getVal(a).substr(k),10)-parseInt(getVal(b).substr(k),10);
});
res=res.concat(temp);
temp=[];j=0;
if(i!==arr.length-1){
i-=1;//减1,再执行查找使while结束的str
}
}
}
}
return res;
}
var arr=[
"//",
",",
"\"3",
"...",
"8",
"2",
"15",
"\"21",
",",
"...",
"1.jpg",
"9.jpg",
"234",
"99",
"13.jpg",
"8.jpg",
"idkinbec",
"idkinbed3",
"idkinbef",
"idkinbegh",
"idkin44.txt",
"idkinb1.txt",
"idkinbd.txt",
"idkinbe.txt",
"idkinbe3.txt",
"idkin(be12.txt",//正则特殊字符
"idkinbe5.txt",
"idkinbe34.txt",
"idkinbe25.txt",
"idkinb.txt",
"idkin23.txt",
"idkin1.txt",
"idkin5.txt",
"idk"
];

var res=fileSort(arr);
for(var i=0;i");
}
document.write("文件数为:"+arr.length+"/"+res.length);

arr=[
{name:'bb',size:'12'},
{name:'a',size:'5'},
{name:'2',size:'9'},
{name:'12',size:'3'}
]
res=fileSort(arr,function(item){
return item.size;
});
for(i=0;iname:"+res[i].name+",size:"+res[i].size);
}
document.write("
文件数为:"+arr.length+"/"+res.length);

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

主要的排序功能源码如下(v1):


代码如下:

var fileSort=function(arr){
arr.sort();
var res=[],temp=[],i=0,j=0,k,reg,sc=true,cur=arr[0];
while(cur.charCodeAt(0)<48){//数字之前的标点等开头的
res[i]=cur;
if(i===arr.length-1)return res;
cur=arr[++i];
}
while(cur.charCodeAt(0)<58){//以数字开头的
temp[j++]=cur;
if(i===arr.length-1)break;
cur=arr[++i];
}
temp.sort(function(a,b){//排序以数字开头的
return parseInt(a,10)-parseInt(b,10);
});
res=res.concat(temp);
temp=[];j=0;
for(;i<arr.length;i++){
cur=arr[i];
if((k=cur.search(/\d+/))===-1 || i===arr.length-1){//最后一个文件时直接添加
res[i]=cur;
}else {
reg=new RegExp("^"+cur.substr(0,k)+"\\d+");
while(cur.search(reg)!==-1){
temp[j++]=cur;
if(i===arr.length-1)break;
cur=arr[++i];
}
if(temp.length>0){
temp.sort(function(a,b){
return parseInt(a.substr(k),10)-parseInt(b.substr(k),10);
});
res=res.concat(temp);
temp=[];j=0;
i-=1;//减1,再执行查找使while结束的str
}
}
}
return res;
}

后来想想,上面的版本中,前面 两个while完全是多余 的,而且去掉之后 ,直接就支持了特殊字符后面中包含数字的排序
v2(注意RegExp尚未escape):


代码如下:

var fileSort=function(arr){
arr.sort();
var res=[],temp=[],i=0,j=0,k,reg,cur;
for(;i<arr.length;i++){
cur=arr[i];
if((k=cur.search(/\d+/))===-1 || i===arr.length-1){//最后一个文件时直接添加
res[i]=cur;
}else {
reg=new RegExp("^"+cur.substr(0,k)+"\\d+");
while(cur.search(reg)!==-1){
temp[j++]=cur;
if(i===arr.length-1)break;
cur=arr[++i];
}
if(temp.length>0){
temp.sort(function(a,b){
return parseInt(a.substr(k),10)-parseInt(b.substr(k),10);
});
res=res.concat(temp);
temp=[];j=0;
i-=1;//减1,再执行查找使while结束的str
}
}
}
return res;
}

另外,最近用jq的发现:
1 :hidden 这个选择会选择所有不可见元素,如果是clone()的元素,还没添加到dom时,都是属于不可见
2 .serialize() 使用这个方法时,需要为form内的表单元素指定name,否则这个方法返回空字符串
3 jstree插件不能与早版本的validate插件同时使用,因为早版本的validate重新了jq的delegate方法,更新版本就好了
4 ui中DatePicker插件不能与有.hasDatepicker的文本框绑定 ,需要先去掉此类名,才行
5 closest,live(delegate)真是好用的方法

(0)

相关推荐

  • JS实现不使用图片仿Windows右键菜单效果代码

    本文实例讲述了JS实现不使用图片仿Windows右键菜单效果代码.分享给大家供大家参考,具体如下: 这里演示JS不使用图片仿Windows右键菜单效果,这款代码灵活使用了文鼎字,配合CSS和JS做出了这个和系统右键菜单很相似的东东. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/js-windows-right-button-menu-codes/ 具体代码如下: <HTML> <HEAD> <TITLE>极酷的多级右

  • JS实现仿Windows7风格的网页右键菜单效果代码

    本文实例讲述了JS实现仿Windows7风格的网页右键菜单效果代码.分享给大家供大家参考.具体如下: 这是一款JS仿Windows7风格的网页右键菜单,可以多级展开的右键菜单,原生JS.可参考性强,学习JavaScript的朋友不可错过.本菜单用户体验极佳,兼容性良好,无jQuery. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/js-win7-style-web-right-menu-codes/ 具体代码如下: <!DOCTYPE htm

  • JS实现仿Windows经典风格的选项卡Tab切换代码

    本文实例讲述了JS实现仿Windows经典风格的选项卡Tab切换代码.分享给大家供大家参考,具体如下: 这款仿Windows风格的选项卡,带有灰色的立体感,示例内容是用JS控制输出,只是为了演示功能,你在用的时候完全可以去掉的. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/js-f-windows-style-tab-demo/ 具体代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 T

  • 基于JS模仿windows文件按名称排序效果

    作个记录,主要是对数字的处理,如果数字的前面字符是相同的,则数字以值比较,而不是单个字符之间的比较. function SortLikeWin(v1, v2) { var a = v1.name; var b = v2.name; var reg = /[0-9]+/g; var lista = a.match(reg); var listb = b.match(reg); if (!lista || !listb) { return a.localeCompare(b); } for (var

  • 通过node-mysql搭建Windows+Node.js+MySQL环境的教程

    前言 MySQL是一款常用的开源数据库产品,通常也是免费数据库的首选.查了一下NPM列表,发现Nodejs有13库可以访问MySQL,felixge/node-mysql似乎是最受关注项目,我也决定尝试用一下. 要注意名字,"felixge/node-mysql"非"node-mysql",安装部分会介绍这个小插曲! 目录 node-mysql介绍 建立MySQL测试库 node-mysql安装 node-mysql使用 1. node-mysql介绍 felixg

  • Windows系统下使用Sublime搭建nodejs环境

    1.下载nodejs,并安装ok后,配置好环境变量. 2.下载sublime text3 3.在package install 包中新增node插件(或者直接去SublimeText-Nodejs插件(https://github.com/tanepiper/SublimeText-Nodejs)下载,下载之后, 在D:\Program Files\SublimeText3\Data\Packages下新建文件夹为Nodejs文件名不要搞错,然后把git上下载的文件都扔进去) 下载后是Subli

  • JavaScript制作windows经典扫雷小游戏

    代码其实很简单,这里就不多废话了 <html> <head> <meta http-equiv="Content-Language" content="zh-cn"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>扫雷-JavaScript Mine Sweeper

  • javascript高级的文件目录排序代码

    刚写完,欢迎大家帮忙测试 完整的测试代码: 高级目录,文件名排序 #page{} 高级目录,文件名排序 主要实现了目录中的数字按大小排序 排序结果: //accepts a string; returns the string with regex metacharacters escaped. the returned string // can safely be used at any point within a regex to match the provided literal s

  • JavaScript生成.xls文件的代码

    贴代码,一切尽在注释中 <html> <head> <meta charset="utf-8"> </head> <body> <input type="button" value="下载设备模板" onclick="foo;" /> <script type="text/javascript" language="ja

  • JavaScript异步上传图片文件的实例代码

    html: <form action="url" enctype="multipart/form-data" id="myform" method="post"> <input accept="image/*" id="addfile" type="file" /> </form> jquery: $("#addfile&

  • JavaScript Base64 作为文件上传的实例代码解析

    例如我们用某些 裁剪插件 得到的图片是 <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAkCAYAAABIdFAMAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAHhJREFUeNo8zjsOxCAMBFB/ KEAUFFR0Cbng3nQPw68ArZdAlOZppPFIBhH5EAB8b+Tlt9MYQ6i1BuqFaq1CKSVcxZ2Acs6406

  • JavaScript高级程序设计(第3版)学习笔记 概述

    在JavaScript面世之初,没有人会想到它会被应用的如此广泛,也远比一般人想象中的要复杂强大的多,在我自己学习的过程中,曾经有过多次震撼,只是常常没有过多久,很多美轮美奂的用法就又模糊起来,希望通过对JavaScript高级程序设计(第3版)的专题学习笔记,能够较为系统的将基础知识梳理一次,也能够将自己平常学习与工作过程中遇到的一些美妙用法记录下来,便于自己再次学习,当然,也希望可以给有需要的朋友们一些力所能及的帮助. 相关术语 先简要说一下和JavaScript相关的一些背景术语,就不详细

  • JavaScript修改注册表实例代码

    注册表有关安全设置项的说明: 注册表路径: HKEY_CURRENT_USER\Software\Microsoft\Windows\CurrentVersion\Internet Settings\Zones 1.         Zones 项包含表示为计算机定义的每个安全区域的项.默认情况下,定义以下 5个区域(编号从 0  到 4): 值                   设置 ------------------------------ 0                 我的电脑

  • javascript读取本地文件和目录方法详解

    JavaScript是网页制作中离不开的脚本语言,依靠它,一个网页的内容才生动活泼.富有朝气.但也许你还没有发现并应用它的一些更高级的功能吧?比如,对文件和文件夹进行读.写和删除,就象在VB.VC等高级语言中经常做的工作一样.怎么样,你是否需要了解这方面的知识?那就请跟我来,本文将详细描述如何使用Javascript语言进行文件操作. 一.功能实现核心:FileSystemObject 对象 其实,要在Javascript中实现文件操作功能,主要就是依靠FileSystemobject对象.在详

  • javascript中类的定义及其方式(《javascript高级程序设计》学习笔记)

    关于javascript中类的继承可以参考阮一峰的Blog<Javascript继承机制的设计思想>,说的很透. 一.在javascript中实例化遇到的问题: 下面用<javascript高级程序设计>中的例子来做说明,假如现在定义了一个car的对象,它是Object类的实例.像下面这样的: 复制代码 代码如下: var oCar=new Object(); oCar.color = "red"; oCar.doors = 4; oCar.mpg = 23;

  • JavaScript高级程序设计(第3版)学习笔记6 初识js对象

    在房子里面可以放你想放的任意事物--如果你有足够的美学造诣,你甚至可以弄一个房中房试试--当然,为了方便管理,我们会给房子里存放的所有事物都会取上一个不重复的名字,比如医药房间里的各种药品名称.在ECMAScript中,你可以在对象中存放任意你想放的数据,同样,我们需要给存放的数据取一个名字--也就是对象的属性名,再存放各种数据.再看看ECMA-262中对象的定义:无序属性的集合,其属性可以包含简单数据类型值.对象或者函数. 进入对象,我开始有些激动了,说实话,让我想起做这系列学习笔记的最初原因

  • JavaScript高级程序设计(第3版)学习笔记3 js简单数据类型

    ECMAScript是一种动态类型的语言,构建于5种简单数据类型(Undefined.Null.Boolean.Number.String)和一种复杂数据类型(Object)的基础之上.这篇文章就来复习一下简单数据类型,我会尽量从编程实践的角度来描述,下面代码运行环境为FireFox 14.0.1. 简单数据类型 简单数据类型 取值 Undefined undefined(只有一个值) Null null(只有一个值) Boolean true|false(只有两个值) Number 数值 St

随机推荐