前端下拉框select标签的插件——select2.js

10月前作者：xinlianluohan 分类：Toy博客阅读(34) 违法举报

这篇具有很好参考价值的文章主要介绍了前端下拉框select标签的插件——select2.js。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

本文采用的是select2 版本：Select2 4.0.6-rc.1。

可以兼容IE8及以上。亲测过。

官网：Getting Started | Select2 - The jQuery replacement for select boxes文章来源地址https://www.toymoban.com/news/detail-788796.html

一、认识select2.js

1、使用插件，首先要引入别人的插件了，你可以选择离线（无网络）或者在线引用的（如果有网络）。

在线引用如下所示：
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/css/select2.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/js/select2.min.js"></script>


离线引用如下所示：注意自己的引用路径哦
<link type="text/css" rel="stylesheet" href="../../plugins/select2/css/select2.min.css">
<script type="text/javascript" src="../../plugins/select

到了这里，关于前端下拉框select标签的插件——select2.js的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：如若内容造成侵权/违法违规/事实不符，请点击违法举报进行投诉反馈，一经查实，立即删除！

分享到：

领支付宝红包赞助服务器费用

selenium定位非select标签的下拉框(div/ul/li)

1.定位下拉框，如果开发者选项是select标签的，我们一般会使用以下方法进行定位： 2.针对不是select属性的下拉框，如果再使用以上方法进行定位并选择可选项，就会报错，例如下拉框是在div标签，div标签下有ul，ul下有li可选项，这时候再使用1中的方法进行定位并选择，就

2024年02月11日
浏览(44)
select2 弹窗中不能输入

把你弹窗的id配置下即可，如图：参考 https://select2.org/dropdown

2024年02月12日
浏览(36)
前端Vue select 下拉框详解以及监听事件

目录简介使用详解演示示例 :key=\\\"option.value\\\" :value=\\\"option.value\\\" 区别监听事件在 Vue 中，下拉框通常通过 select 元素与一系列的 option 元素来创建。Vue 的数据绑定和指令（如 v-model 和 v-for ）可以使创建动态下拉框变得非常简单和灵活。下面详细介绍如何在 Vue 中使

2024年02月20日
浏览(49)
fastadmin框架select下拉框该怎么写（接口数据）

先让大家看一下最终效果：来上代码：这里给大家解释一下class名：selectpicker，如果没有这个class名的话他就是一个普通的下拉框：然后，下一个问题：怎么给select数据呢？这个呢需要再php(控制器)里面给，至于在那个方法看你自己，我是在_initialize方法给的数据请求接口

2024年02月11日
浏览(37)
前端常用的一些插件、UI框架、js库，样式库以及官方文档。【持续更新】

1.1 文档地址 API文档 1.2 安装教程 1.下载安装 2.导入 2.1 文档地址 API文档 2.2 安装教程 1.下载安装 2.导入 3.1 文档地址 API文档 3.2 安装教程 1.下载安装 2.导入 3.安装遇到的问题 1）描述 ① 控制台报错 ② 终端报错输出的内容都是 \\\"export xxx was not found in \\\'vue\\\' 2）解决 ① 先卸载 ya

2024年02月03日
浏览(42)
JS中操作＜select＞标签选的值

select标签是一种表单控件，用来创建下拉列表。在select 标签内可用 option 标签定义下拉列表中的可用选项。下面给出一个基本下拉列表示例：保存文件名：简单下拉列表示例a.html，用浏览器打开效果： JS操作下拉列表中的选项 select标签下的内容，可以通过JS的操作，获取其对

2024年02月03日
浏览(23)
jeecg-boot Vu2前端-下拉搜索框j-search-select-tag

官网提到了怎么弄，但是很多细节官网还没完善的，我个人作为开发者提供一下代码给你们参考以及使用以上是效果现在讲下实现的过程此处是jeecg-boot 官网封装好的一个组件，这个组件。 sys_depart,depart_name,id 这个的意思是去 sys_depart 表里，查询的列 depart_name ， id = key

2024年02月06日
浏览(51)
jeecg-boot Vue2前端-下拉搜索框j-search-select-tag

官网提到了怎么弄，但是很多细节官网还没完善的，我个人作为开发者提供一下代码给你们参考以及使用以上是效果现在讲下实现的过程此处是jeecg-boot 官网封装好的一个组件，这个组件。 sys_depart,depart_name,id 这个的意思是去 sys_depart 表里，查询的列 depart_name ， id = key

2024年01月17日
浏览(46)
前端引入外部 js文件

在 head /head 中使用 script 标签引入。这是最简单的方法，这种方法在项目加载时就会引入，但有时候需要在不同环境下判断是否需要引入，比如微信中引入，钉钉中不引入等。所以还需要用其它方法来引入。使用 js 创建 script 标签去引入。可以在引入前添加判断条件，来决定

2024年02月12日
浏览(46)
vsCode实现引入js文件的代码提示插件推荐

在html文件中，通过src引入独立的js文件时实现代码提示。如，js文件中定义了一个demo函数，在1.html文件中，引入这个js文件后，在js代码块里面，输入d就会有提示demo函数候选项，太方便了。插件： Html Embedded Javascript 在vscode插件商店中直接搜索安装，不用配置；

2024年02月16日
浏览(43)