非常实用的select下拉框-Select2.js
在Web开发中,Select下拉框是常用的输入组件。由于原生的Select几乎很难通过CSS样式控制。一些好看的Select下拉框就只能通过模拟来实现。PHP程序员雷雪松给大家推荐一筐款不错的Select下拉框插件:Select2。Select2可以支持搜索、标签、远程数据、无限滚动、和许多其他非常优秀的选项,Select2还可以非常方便的自定义样式,基本可以实现所有的Select效果。下面PHP程序员雷雪松就详细的讲解一下Select2.js的用法。
1、引入select2.js和select2.css
<link href="./select2.min.css" rel="stylesheet" />
<script src="./jquery.min.js"></script>
<script src="./select2.min.js"></script>
2、Select2基础用法
<select class="js-select2" name="job">
<option value="phper">PHP程序员</option>
<option value="web">web前端</option>
</select>
$(document).ready(function() {
$('.js-select2').select2();
});
Select2官方网站:https://select2.org
非常实用的select下拉框-Select2.js的更多相关文章
- jQuery插件实现select下拉框左右选择_交换内容(multiselect2side)
效果图: 使用jQuery插件---multiselect2side做法: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitio ...
- select下拉框左右变换
效果图: 使用jQuery插件---multiselect2side做法: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 ...
- 一款基于jQuery的联动Select下拉框
今天我们要来分享一款很实用的jQuery插件,它是一个基于jQuery多级联动的省市地区Select下拉框,并且值得一提的是,这款联动下拉框是经过自定义美化过的,外观比浏览器自带的要漂亮许多.另外,这 ...
- jQuery制作简洁的多级联动Select下拉框
今天我们要来分享一款很实用的jQuery插件,它是一个基于jQuery多级联动的省市地区Select下拉框,并且值得一提的是,这款联动下拉框是经过自定义美化过的,外观比浏览器自带的要漂亮许多.另外,这 ...
- 带搜索框的select下拉框
利用select2制作带有搜索功能的select下拉框 1.引入线上css和js <link href="https://cdnjs.cloudflare.com/ajax/libs/ ...
- s:select下拉框validation验证
S:select下拉框验证: <td colspan="5"> <s:select name="vo.typeVO.corp" list=&q ...
- 自定义样式的select下拉框深入探索
第一个版本: 首先实现自定义select下拉框应该具有的功能,我是选择将原来的select隐藏掉,自己在jquery代码中动态写进去<dl><dd><dt>这样的结 ...
- jquery取消选择select下拉框
有三个select下拉框一个大类,两个小类隐藏,需要在选择大类的时候,小类显示同时清除另外的小类选择的项这需求有点儿.......... 下面是三个select: <select name=&q ...
- jquery选中将select下拉框中一项后赋值给text文本框
jquery选中将select下拉框中一项后赋值给text文本框,出现无法将第一个下拉框的value赋值给文本框 因为select默认选中第一项..在选择第一项时,便导致无法激发onchange事件. ...
随机推荐
- windows7(win7)64/32位激活工具
win7激活工具中文绿色免费版是改自binbin的作品,我们修改的windows7激活工具grldr模拟激活是别人的东西,能激活win7旗舰.原作者是binbin,其他的激活工具都是基于grldr模拟 ...
- SQL Server 根据日期分组、 根据时间段分组(每三个小时一组)
所用数据表: 一.根据日期分组 1. 使用convert() 函数方式 --根据年月 ),CreatTime,)日期,COUNT(*) 次数,sum(Money)总数 from Orders ),Cr ...
- ES6中用&&跟||来简化if{}else{}的写法
目录 ES6中用&&跟||来简化if{}else{}的写法 1. if else的写法 2. ES6中 && ||的用法 3 ES6实例 4 开发环境 ES6中用&am ...
- 原创:Python编写通讯录,支持模糊查询,利用数据库存储
1.要求 数据库存储通讯录,要求按姓名/电话号码查询,查询条件只有一个输入入口,自动识别输入的是姓名还是号码,允许模糊查询. 2.实现功能 可通过输入指令进行操作. (1)首先输入“add”,可以对通 ...
- GitHub使用整理——从开始到上传项目
前期准备 首先是github官网: https://github.com/ 下载github工具: https://git-for-windows.github.io/ 进入github创建一个新的项 ...
- Excel催化剂开源第1波-自定义函数的源代码全公开
Excel催化剂插件从2018年1月1日开始运营,到今天刚好一周年,在过去一年时间里,感谢社区里的许多友人们的关心和鼓励,得以坚持下来,并收获一定的用户量和粉丝数和少量的经济收入回报和个人知名度的提升 ...
- NameNode和SecondaryNameNode的工作机制
NameNode&Secondary NameNode 工作机制 NameNode: 1.启动时,加载编辑日志和镜像文件到内存 2.当客户端对元数据进行增删改,请求NameNode 3.Nam ...
- Git学习笔记 (二)
Git学习笔记(二) 突然发现,学习新知识新技能,都得经常温故使用,这样才能日益精进.最近学习的Git是因为加入了课题组,在学习做一些后台,由于后台开发会牵扯到多人开发,所以学会Git这一代码管理工具 ...
- 浅谈CMDB
CMDB和运维自动化 一.运维 运维,指的是对已经搭建好的网络,软件,硬件进行维护.运维领域也是细分的,有硬件运维和软件运维 硬件运维主要包括对基础设施的运维,比如机房的设备,主机的硬盘,内存这些物理 ...
- 自动化部署方案CICD
自动化部署方案 由于来来也的时间不久,可能对现有的部署情况不是很了解,以下是个人对POC自动化部署的设计方案. 自动化部署优点 降低成本,提高生产力,高可用,更可靠,性能优化 与gitlab持 ...