jQuery实现的简单排序功能示例【冒泡排序】


Posted in Javascript onJanuary 13, 2017

本文实例讲述了jQuery实现的简单排序功能。分享给大家供大家参考,具体如下:

这里演示的冒泡排序, 通过不断的循环找出最小的值,放到新的数组中。每次循环后都将指针指向下一个元素。直到两层循环都结束。

index.html:

<html>
<head>
 <title>Sort</title>
 <meta content="text/html" charset="utf-8">
 <script type="text/javascript" language="javascript" src="js/jquery-1.10.2.js"></script>
 <script type="text/javascript" language="javascript">
  $(function(){
   var Sort={};
   (function(Sort){
    Sort.initData={
     toSortArr:[]
    };
    Sort.methods=(function(){
     var tmp='';
     return {
      init:function(){
       //
      },
      pushData:function(arr){
       for(var i in arr){
        Sort.initData.toSortArr.push(arr[i]);
       }
      },
      getData:function(){
       return Sort.initData.toSortArr;
      },
      sortData:function(arr){
       var tmpArr=new Array();
       var tmpNumArr=new Array();
       var tmpCharArr=new Array();
       var tmpOtherArr=new Array();
       for(var i in arr){
        var at=arr[i].charCodeAt(0);
        if( at>=48 && at<=57 ){
         tmpNumArr.push(arr[i]);
        }else{
         if(at>=65 && at<=122 ){
          tmpCharArr.push(arr[i]);
         }else{
          tmpOtherArr.push(arr[i]);
         }
        }
       }
       tmpNumArr=Sort.methods.getSort(tmpNumArr);
       tmpCharArr=Sort.methods.getSort(tmpCharArr);
       tmpOtherArr=Sort.methods.getSort(tmpOtherArr);
       tmpArr=Sort.methods.restoreArr(tmpArr,tmpNumArr);
       tmpArr=Sort.methods.restoreArr(tmpArr,tmpCharArr);
       tmpArr=Sort.methods.restoreArr(tmpArr,tmpOtherArr);
       return tmpArr;
      },
      getSort:function(arr){
       for(var i=0;i<arr.length;i++){
        for(var j=i;j<arr.length;j++){
         if(arr[i]>arr[j]){
          var tmp=arr[i];
          arr[i]=arr[j];
          arr[j]=tmp;
         }
        }
       }
       return arr;
      },
      restoreArr:function(tmpArr,arr){
       for(var i=0;i<arr.length;i++){
        tmpArr.push(arr[i]);
       }
       return tmpArr;
      }
     }
    })();
   })(Sort);
   var tmpArr=new Array();
   tmpArr.push('zfsd');
   tmpArr.push('qwerewtrer');
   tmpArr.push('fxdfhk');
   tmpArr.push('123');
   tmpArr.push('ssjdf');
   tmpArr.push('kl;');
   tmpArr.push('我的;');
   tmpArr.push('sdg');
   tmpArr.push('rt');
   Sort.methods.pushData(tmpArr);
   var t=Sort.methods.sortData(tmpArr);
   console.log(tmpArr);
   console.log(t);
  });
 </script>
</head>
<body>
<input id="myFormFlow" type="button" value="进入表单填写">
</body>
</html>

此排序的核心代码:

var arr=new Array();
for(var i=0;i<arr.length;i++){
 for(var j=i;j<arr.length;j++){
  if(arr[i]>arr[j]){
   var tmp=arr[i];
   arr[i]=arr[j];
   arr[j]=tmp;
  }
 }
}

希望本文所述对大家jQuery程序设计有所帮助。

Javascript 相关文章推荐
Prototype最新版(1.5 rc2)使用指南(1)
Jan 10 Javascript
js跨域和ajax 跨域问题的实现思路
Sep 05 Javascript
ExtJs Excel导出并下载IIS服务器端遇到的问题
Sep 16 Javascript
javascript实现网页背景烟花效果的方法
Aug 06 Javascript
js模仿java的Map集合详解
Jan 06 Javascript
三种Node.js写文件的方式
Mar 08 Javascript
基于javascript实现tab切换特效
Mar 29 Javascript
JavaScript中 ES6 generator数据类型详解
Aug 11 Javascript
JavaScript实现打印星型金字塔功能实例分析
Sep 27 Javascript
js实现网页同时进行多个倒计时功能
Feb 25 Javascript
jquery实现有过渡效果的tab切换
Jul 17 jQuery
JS如何实现封装列表右滑动删除收藏按钮
Jul 23 Javascript
js实现淡入淡出轮播切换功能
Jan 13 #Javascript
js仿百度音乐全选操作
Jan 13 #Javascript
js实现tab选项卡切换功能
Jan 13 #Javascript
js制作可以延时消失的菜单
Jan 13 #Javascript
原生js实现下拉框功能(支持键盘事件)
Jan 13 #Javascript
js实现自动轮换选项卡
Jan 13 #Javascript
Javascript 使用ajax与C#获取文件大小实例详解
Jan 13 #Javascript
You might like
php中禁止单个IP与ip段访问的代码小结
2012/07/04 PHP
不用写JS也能使用EXTJS视频演示
2008/12/29 Javascript
Google Map API更新实现用户自定义标注坐标
2009/07/29 Javascript
Nodejs极简入门教程(二):定时器
2014/10/25 NodeJs
JavaScript静态类型检查工具FLOW简介
2015/01/06 Javascript
javascript转换日期字符串为Date日期对象的方法
2015/02/13 Javascript
JavaScript中的anchor()方法使用详解
2015/06/08 Javascript
javascript获取网页宽高方法汇总
2015/07/19 Javascript
Bootstrap CSS布局之按钮
2016/12/17 Javascript
JS实现为动态添加的元素增加事件功能示例【基于事件委托】
2018/03/21 Javascript
Vue.js单向绑定和双向绑定实例分析
2018/08/14 Javascript
vue canvas绘制矩形并解决由clearRec带来的闪屏问题
2019/09/02 Javascript
javascript写一个ajax自动拦截并下载数据代码实例
2019/09/07 Javascript
原生js+css调节音量滑块
2020/01/15 Javascript
[02:05:03]完美世界DOTA2联赛循环赛 LBZS VS Matador BO2 10.28
2020/10/28 DOTA
RC4文件加密的python实现方法
2015/06/30 Python
Python实现统计给定列表中指定数字出现次数的方法
2018/04/11 Python
解决nohup执行python程序log文件写入不及时的问题
2019/01/14 Python
对Python定时任务的启动和停止方法详解
2019/02/19 Python
django创建超级用户过程解析
2019/09/18 Python
Python 类,property属性(简化属性的操作),@property,property()用法示例
2019/10/12 Python
Python实现子类调用父类的初始化实例
2020/03/12 Python
详解tensorflow之过拟合问题实战
2020/11/01 Python
python 实现图片批量压缩的示例
2020/12/18 Python
如何用 Python 处理不平衡数据集
2021/01/04 Python
python+selenium自动化实战携带cookies模拟登陆微博
2021/01/19 Python
CSS3 渐变(Gradients)之CSS3 线性渐变
2016/07/08 HTML / CSS
基于CSS3实现的几个小loading效果
2018/09/27 HTML / CSS
马来西亚综合购物网站:Lazada马来西亚
2018/06/05 全球购物
档案管理员岗位职责
2013/12/01 职场文书
企业员工薪酬方案
2014/06/04 职场文书
2014年入党积极分子学习三中全会思想汇报
2014/09/13 职场文书
2015年幼儿园学期工作总结
2015/05/22 职场文书
庆七一活动简报
2015/07/20 职场文书
慰问信(范文3篇)
2019/10/23 职场文书
三星 3nm 芯片将于第二季度开始量产
2022/04/29 数码科技