项目中有个需求,下拉框既可以下拉选择,也可以手动填写

html代码

  <span>数据来源</span>
<select class="source id="noMean"> <option value="0">人工导入</option> <option value="1">数据服务平台</option> </select>

js代码

 $('#noMean').editableSelect({
filter:false,
effects: 'fade',
duration: 200,
onCreate:function () {
console.log("下拉框创建")
},
onShow:function () {
console.log("下拉框显示")
},
onHide:function () {
console.log("下拉框隐藏")
},
onSelect:function () {
console.log("下拉框选项被选中")
} }

获取值

$(".noMean").val()

用了这个插件以后,这块是一个input,type="text"

参数

filter  选择option以后,是否过滤  默认 true

effects  点击的时候,下拉框的过渡效果  有default,slide,fade三个值,默认是default

duration  过渡效果时间  默认是fast  值可以是fast和slow,也可以是数字

appendTo  下拉框如果弹出框效果,这个值才会用到,显示把它加载到哪里

trigger  下拉框列表如何触发 值是"focus""manual"  默认是focus

方法

onCreate:当editableSelect方法生效时触发

onShow:当下拉框出现时触发。

onHide:当下拉框隐藏时触发。

onSelect:当下拉框中的选项被选中时触发。

参考地址:

https://www.npmjs.com/package/jquery-editable-select  npm安装

http://indrimuska.github.io/jquery-editable-select/  demo地址

https://github.com/zhaobao1830/jquery-editable-select  下载地址

select下拉框插件jquery.editable-select的更多相关文章

  1. select下拉框插件(转)

    <!doctype html> <html> <head> <meta charset="UTF-8"> <title> ...

  2. 非常实用的select下拉框-Select2.js

    在Web开发中,Select下拉框是常用的输入组件.由于原生的Select几乎很难通过CSS样式控制.一些好看的Select下拉框就只能通过模拟来实现.PHP程序员雷雪松给大家推荐一筐款不错的Sele ...

  3. Python3.x:遍历select下拉框获取value值

    Python3.x:遍历select下拉框获取value值 Select提供了三种选择方法: # 通过选项的顺序,第一个为 0 select_by_index(index) # 通过value属性 s ...

  4. select下拉框之默认选项清空

    最近和小伙伴发现,select默认选项一般是提示信息,怎么才能让当我们点击下拉框时,可选的选项中没有默认的提示信息呢? 思路: 1.当点击下拉框时,让默认提示信息,即下拉框第一个选项移除. 2.当没有 ...

  5. layui给select下拉框赋值

    转: layui给select下拉框赋值 layui给select下拉框赋值 //重新渲染表单函数 function renderForm() { layui.use('form', function ...

  6. jquery Combo Select 下拉框可选可输入插件

    Combo Select 是一款友好的 jQuery 下拉框插件,在 PC 浏览器上它能模拟一个简单漂亮的下拉框,在 iPad 等移动设备上又能回退到原生样式.Combo Select 能够对选项进行 ...

  7. jQuery插件实现select下拉框左右选择_交换内容(multiselect2side)

    效果图: 使用jQuery插件---multiselect2side做法: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitio ...

  8. 基于jQuery select下拉框美化插件

    分享一款基于jQuery select下拉框美化插件.该插件适用浏览器:IE8.360.FireFox.Chrome.Safari.Opera.傲游.搜狗.世界之窗.效果图如下: 在线预览   源码下 ...

  9. 一款基于jQuery的联动Select下拉框

    今天我们要来分享一款很实用的jQuery插件,它是一个基于jQuery多级联动的省市地区Select下拉框,并且值得一提的是,这款联动下拉框是经过自定义美化过的,外观比浏览器自带的要漂亮许多.另外,这 ...

随机推荐

  1. GCC编译器原理(二)------编译原理一:ELF文件(2)

    四. ELF 文件格式分析 ELF文件(目标文件)格式主要四种: 可重定向文件: 文件保存着代码和适当的数据,用来和其他的目标文件一起来创建一个可执行文件或者是一个共享目标文件.(目标文件或者静态库文 ...

  2. 【python小练】0014题 和 0015 题

    第 0014 题: 纯文本文件 student.txt为学生信息, 里面的内容(包括花括号)如下所示: { ":["张三",150,120,100], ":[& ...

  3. TensorFlow从入门到理解(一):搭建开发环境【基于Ubuntu18.04】

    *注:教程及本文章皆使用Python3+语言,执行.py文件都是用终端(如果使用Python2+和IDE都会和本文描述有点不符) 一.安装,测试,卸载 TensorFlow官网介绍得很全面,很完美了, ...

  4. 深入理解内存模型JMM

    JMM(java memory model)java内存模型主要目标是定义程序中的变量,(此处所指的变量是实例字段.静态字段等,不包含局部变量和函数参数,因为这两种是线程私有无法共享)在虚拟机中存储到 ...

  5. python3:实现输出等边三角形、直角三角形

    学习python,用的是3.5的版本: 记录一下学习历程~ 一.先来一个简单的,输出直角三角形: ***知识点:for循环,range()函数 二.进阶:输出等边三角形 ******知识点:嵌套for ...

  6. yum1

    yum 显示仓库repolist [all|emabled|disabled] 显示软件list (anaconda表示装系统的时候就装上的软件) yum list all yum list php* ...

  7. 浏览器修改或添加Cookie--chrome插件【edit this cookie】、【postman】

    需求背景:某天用浏览器请求某个 API 提示: {"RESULT_TYPE" : -1 , "STATE" : 401 , "RESULT_DESC& ...

  8. 什么是java字节码?

    什么是java字节码? java字码是java源程序代码的一种较为低级的表示.Java编译器将源代码编译成字码后,就可以Java解释器执行

  9. imooc-free

    前端性能优化-通用的缓存SDK 依赖项 1.在hosts文件中配置  127.0.0.1 http://cc.imooc.com   就可以直接访问 http://cc.imooc.com:3000 ...

  10. Javascript - ExtJs - TabPanel组件

    示例 Ext.create('Ext.tab.Panel', {     width: "100%",     renderTo: "tabBox",      ...