<!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. 通过UIImagePickerController完成照相和相片的选取

    UIImagePickerController是用于选取现有照片,或者用照相机现场照一张相片使用的 定义: @interface ShowViewController : UIViewControll ...

  2. Spoj 7001 Visible Lattice Points 莫比乌斯,分块

    题目:http://acm.hust.edu.cn/vjudge/problem/viewProblem.action?id=37193   Visible Lattice Points Time L ...

  3. maven 私服 配置 转

    3 . Nexus预置的仓库 点击左侧 Repositories 链接,查看 Nexus 内置的仓库: Nexus 的仓库分为这么几类: hosted 宿主仓库:主要用于部署无法从公共仓库获取的构件( ...

  4. return的用处

    #include "stdio.h" main() { ,c=; ;a<;a++) { c=c+a; } printf("%d",c); return ; ...

  5. 用python正则表达式提取字符串

    在日常工作中经常遇见在文本中提取特定位置字符串的需求.python的正则性能好,很适合做这类字符串的提取,这里讲一下提取的技巧,正则表达式的基础知识就不说了,有兴趣的可以看re的教程. 提取一般分两种 ...

  6. 20169210《Linux内核原理与分析》第三周作业

    本次作业也是分为两部分,第一部分是对实验楼<Linux基础入门>复习,第二部分为对课本18章的复习. 第一次学习实验楼的<Linux基础入门>时由于是第一次接触Linux,所以 ...

  7. 构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统（27）-权限管理系统-分配用户给角色

    原文:构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统(27)-权限管理系统-分配用户给角色 分配用户给角色,跟分配角色给用户操作是基本一致的. 打开模块维护,展 ...

  8. nanosleep纳秒级延迟

    //函数原型 int nanosleep(struct timespec *req, struct timespec *rem) //参数列表: // req:要求的睡眠时间 // rem:剩余的睡眠 ...

  9. 改变Android按钮背景颜色的高效方法

    本文将介绍一种有效改变Android按钮颜色的方法. 按钮可以在状态改变时改变其颜色(例如按下,禁用,高亮显示).但是,这需要一一说明每个状态.这篇文章将提供你一个根据状态变化轻松改变按钮颜色的方法. ...

  10. GDB技巧整理

    https://blog.atime.me/note/gdb-tricks.html 整理常用的gdb技巧. 常用命令 常用的gdb命令... 启动gdb 直接运行 gdb --args prog a ...