<!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. UIImageVIew的使用

    UIImageView是一个用于显示图片的控件 构造方法:     UIImage * tempImage = [UIImage imageNamed:IMAGE_NAME];     imageVi ...

  2. KiCad中层定义

    5.2.1. Paired layers The Adhesives layers (Copper and Component):    These are used in the applicati ...

  3. NewSQL——优化的SQL存储引擎(TokuDB, MemSQL)+?

    NewSQL 是对各种新的可扩展/高性能数据库的简称,这类数据库不仅具有NoSQL对海量数据的存储管理能力,还保持了传统数据库支持ACID和SQL等特性. NewSQL 是指这样一类新式的关系型数据库 ...

  4. 使用Codis搭建redis集群服务

    转(http://www.jianshu.com/p/f8e968e57863) 一. 应用场景 redis 作为数据结构存储引擎,有着很多优点 高性能单机引擎可以达到5-10W qps 数据结构全面 ...

  5. Epoll之ET、LT模式

    Epoll之ET.LT模式 在使用epoll时,在函数 epoll_ctl中如果不设定,epoll_event 的event默认为LT(水平触发)模式. 使用LT模式意味着只要fd处于可读或者可写状态 ...

  6. 【Android - 框架】之Glide的使用

    一.Glide简介: Glide是Google官方推荐的一个图片加载和缓存的开源库,它不仅能实现平滑的图片列表滚动效果,还支持远程图片的获取.大小调整和展示,并且可以加载GIF图片.Glide相比与U ...

  7. html5 文件拖拽上传

    本文首先发表在  码蜂笔记 : http://coderbee.net/index.php/web/20130703/266 html5 文件拖拽上传是个老话题了,网上有很多例子,我一开始的代码也是网 ...

  8. 还原virtual函数的本质-----C++

    当你每次看到C++类中声明一个virtual函数,特别是看到了一个virtual的虚构函数.你知道它的意思吗?你肯定会毫不犹豫的回答:不就是多态么...在运行时确定具体的行为么...完全正确,但这里我 ...

  9. android 16 带返回值的activity

    main.xml <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" andro ...

  10. 韩玉琪 《Linux内核分析》MOOC课程

    http://www.cnblogs.com/hyq20135317/p/5422516.html http://mooc.study.163.com/course/USTC-1000029000