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 相关文章推荐
JavaScript开发时的五个注意事项
Dec 08 Javascript
js 数值转换为3位逗号分隔的示例代码
Feb 19 Javascript
JavaScript高级教程5.6之基本包装类型(详细)
Nov 23 Javascript
直接拿来用的页面跳转进度条JS实现
Jan 06 Javascript
50 个 jQuery 插件可将你的网站带到另外一个高度
Apr 26 Javascript
jquery实现全选和全不选功能效果的实现代码【推荐】
May 05 Javascript
H5移动端适配 Flexible方案
Oct 24 Javascript
iOS + node.js使用Socket.IO框架进行实时通信示例
Apr 14 Javascript
Angular2使用Augury来调试Angular2程序
May 21 Javascript
vue2.0 兄弟组件(平级)通讯的实现代码
Jan 15 Javascript
ES6中的类(Class)示例详解
Dec 09 Javascript
Axios取消重复请求的方法实例详解
Jun 15 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
《星际争霸2》终章已出 RTS时代宣告终结
2017/02/07 星际争霸
在php中使用sockets:从新闻组中获取文章
2006/10/09 PHP
PHP将整个网站生成HTML纯静态网页的方法总结
2012/02/05 PHP
php中计算未知长度的字符串哪个字符出现的次数最多的代码
2012/08/14 PHP
怎样给PHP源代码加密?PHP二进制加密与解密的解决办法
2013/04/22 PHP
ThinkPHP控制器里javascript代码不能执行的解决方法
2014/11/22 PHP
PHP也能干大事之PHP中的编码解码详解
2015/04/20 PHP
jQuery 美元符冲突的解决方法
2010/03/28 Javascript
jquery如何把参数列严格转换成数组实现思路
2013/04/01 Javascript
javascript使用onclick事件改变选中行的颜色
2013/12/30 Javascript
node.js中的console.assert方法使用说明
2014/12/10 Javascript
jQuery制作简洁的多级联动Select下拉框
2014/12/23 Javascript
JS+CSS实现感应鼠标渐变显示DIV层的方法
2015/02/20 Javascript
jQuery实现带幻灯的tab滑动切换风格菜单代码
2015/08/27 Javascript
jquery实现移动端点击图片查看大图特效
2020/09/11 Javascript
基于BootStrap环境写jQuery tabs插件
2016/07/12 Javascript
jQuery ajax 当async为false时解决同步操作失败的问题
2016/11/18 Javascript
angularjs中使用ng-bind-html和ng-include的实例
2017/04/28 Javascript
Node.js中环境变量process.env的一些事详解
2017/10/26 Javascript
js获取html页面代码中图片地址的实现代码
2018/03/05 Javascript
微信小程序实现页面下拉刷新和上拉加载功能详解
2018/12/03 Javascript
React 使用recharts实现散点地图的示例代码
2018/12/07 Javascript
微信小程序实现的绘制table表格功能示例
2019/04/26 Javascript
vue 获取及修改store.js里的公共变量实例
2019/11/06 Javascript
[01:30:55]VG vs Mineski Supermajor 败者组 BO3 第三场 6.6
2018/06/07 DOTA
Python实现屏幕截图的两种方式
2018/02/05 Python
python实现决策树、随机森林的简单原理
2018/03/26 Python
Numpy中转置transpose、T和swapaxes的实例讲解
2018/04/17 Python
Python图像处理之图像的读取、显示与保存操作【测试可用】
2019/01/04 Python
Holland & Barrett爱尔兰:英国领先的健康零售商
2019/03/31 全球购物
林肯就职演讲稿
2014/05/19 职场文书
法人委托书范本格式
2014/09/15 职场文书
2014年银行员工工作总结
2014/11/12 职场文书
工作检讨书范文
2015/01/23 职场文书
政审证明材料
2015/06/19 职场文书
golang fmt格式“占位符”的实例用法详解
2021/07/04 Golang