<!DOCTYPE html>

<html lang="zh">

    <head>

        <meta charset="utf-8"/>

        <title>针对选择框词典式排序</title>

        <script type="text/javascript" src="../js/jquery-1.11.0.js"></script>

        <script type="text/javascript">

            $(function() {

                /*$('button').click(function() {

                    var options = $('option');

                    for (var i = 1; i < options.length; i++) {

                        for (var j = 0; j < i; j++) {

                            var currOption = $(options.get(i)),

                                loopOption = $(options.get(j));

                            if (currOption.text() < loopOption.text()) {

                                currOption.insertBefore(loopOption);

                            }

                        }

                    }

                });*/

                $('button').click(function() {

                    var $options = $('option');

                    $options.sort(function(a, b) {

                        if ($(a).text() > $(b).text()) return 1;

                        else return -1;

                    });

                    $('select').html($options);

                });

            });

        </script>

    </head>

    <body>

        <button>排序</button>

        <select>

            <option>php</option>

            <option>c</option>

            <option>javascript</option>

            <option>css</option>

            <option>html</option>

            <option>python</option>

        </select>

    </body>

</html>

[jQuery编程挑战]004 针对选择框词典式排序的更多相关文章

  1. 基于jQuery美化联动下拉选择框

    今天给大家介绍一款基于jQuery美化联动下拉选择框.这款下下拉选择框js里自带了全国所有城市的数数库.下拉选择框适用浏览器:IE8.360.FireFox.Chrome.Safari.Opera.傲 ...

  2. jquery.chosen.js下拉选择框美化插件项目实例

    由于之前使用的bootstrap-select插件是建立在bootstrap基础上的,实际使用到项目中的时候,与我们使用的ace-admin(基于bootstrap)存在样式冲突,导致下拉框的样式发生 ...

  3. jquery如何实现动态增加选择框

    jquery如何实现动态增加选择框 一.总结 一句话总结:用jquery的clone(true)方法. 1.如何在页面中复制amazeui加了特效的标签? amazeui中的控件带js方法,不知道那部 ...

  4. JQuery Mobile - 动态修改select选择框的选中项

    <label for="day">选择天</label> <select name="day" id="day" ...

  5. [jQuery编程挑战]003 克隆一个页面元素及其相关事件

    挑战: a) 绑定一个点击方法到这个div,点击后此元素会淡出消失 b) 同时克隆一个新的div元素到页面,元素内容是前面div文字内容反向书写(即,sgatbg olleh),同样也具有上面的点击事 ...

  6. [jQuery编程挑战]001：实现页面元素加速动画效果

    要求: 页面包含两个HTML元素:一个按钮,一个小方块 动画要求:点击按钮,小方块从页面坐标300,300,加速移动到0,0 相关知识点: jQuery动画方法animate easing参数的设置 ...

  7. 【WorkTile赞助】jQuery编程挑战#009：生成两个div元素互相追逐的动画

    HTML页面: <!-- HTML代码片段中请勿添加<body>标签 //--> <div id="container"> <div id ...

  8. [jQuery编程挑战]008 生成逗号分隔数字

    <!DOCTYPE html> <html lang="zh"> <head> <meta charset="utf-8&quo ...

  9. [jQuery编程挑战]007 切换数据表格的行列

    <!DOCTYPE html> <html lang="zh"> <head> <meta charset="utf-8&quo ...

随机推荐

  1. Bzoj 1612: [Usaco2008 Jan]Cow Contest奶牛的比赛 传递闭包,bitset

    1612: [Usaco2008 Jan]Cow Contest奶牛的比赛 Time Limit: 5 Sec  Memory Limit: 64 MBSubmit: 891  Solved: 590 ...

  2. 关于ATL的rgs注册文件

    转自:http://blog.csdn.net/idiszerg/article/details/3875934 使用ATL向导的话,会在resource中产生一个rgs的注册脚本文件放在" ...

  3. poj 1564 Sum It Up【dfs+去重】

    Sum It Up Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 6682   Accepted: 3475 Descrip ...

  4. zoj 2100 Seeding

    Seeding Time Limit: 2 Seconds      Memory Limit: 65536 KB It is spring time and farmers have to plan ...

  5. C#中HashTable的用法示例1

    一,哈希表(Hashtable)简述 在.NET Framework中,Hashtable是System.Collections命名空间提供的一个容器,用于处理和表现类似keyvalue的键值对,其中 ...

  6. stickyListHeaders框架的使用

    最近在Demo中使用到了stickyListHeaders框架实现悬停效果 比较好用 在xml中 <se.emilsjolander.stickylistheaders.StickyListHe ...

  7. ckeditor_4.5.10_full上传图片功能

    1.找到image.js

  8. test、exec、match区别

    test.exec.match的简单区别 1.test test 返回 Boolean,查找对应的字符串中是否存在模式. var str = "1a1b1c"; var reg = ...

  9. LINQ 从 CSV 文件生成 XML

    本文参考:http://msdn.microsoft.com/zh-cn/library/bb387090.aspx 下面的代码对字符串数组执行 LINQ 查询. 在 C# 版本中,该查询使用 let ...

  10. XtraReport交叉表自适应行高及最佳列宽

    1.自适应行头的行高,绑定CustomRowHeight事件,代码如下: private Graphics gr = Graphics.FromHwnd(IntPtr.Zero); private v ...