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

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. XXE攻防总结

    1. 前言与XML格式相同的web漏洞,比较广泛的共有xpath注入.xml注入.soap注入.XXE四种. 2. XML相关的介绍针对xml语言,要明白两个特性:合法性与合理性.所谓合法性,是指语法 ...

  2. /*+ hint*/用法,该如何解决

    /*+ use_hash(b, a)*/用法SELECT /*+ use_hash(b, a)*/  1,  NVL(b.AgentWorkGroup, ' '),  ................ ...

  3. cpp 常量函数(函数后加const)

    const用在成员函数后 主要是针对类的const 对象 如: class Text{ public:     void printconst(void)const{cout<<" ...

  4. react ,ant Design UI中table组件合并单元格并展开详情的问题

    需求:购物车订单列表,如图: 一:单元格合并 遇到这种你会怎么办呢?  单元格合并?  还是其他的方法? 下面是我的处理方式,就是在table 组件的columns上处理,这里拿商品举例,其余的类似, ...

  5. 第26月第2天 vim javacomplete

    1. 将解压出来的autoload 和 doc的内容添加到~/.vim/下的相应目录下,如果~/.vim下没有这两个文件夹就手动创建其中autoload里的有javacomplete.vim java ...

  6. 微服务之Spring cloud

    微服务 Spring cloud Spring Cloud provides tools for developers to quickly build some of the common patt ...

  7. DeepLearning.ai-Week4-Face Recognition for the Happy House

    1 - Task Implement the triplet loss function Use a pretrained model to map face images into 128-dime ...

  8. 30个极大提高开发效率的vscode插件

    参考链接:https://blog.fundebug.com/2018/07/24/vs-extensions/

  9. python异常处理的两种写法

    (1)第一种写法 需要注意的是 在抛出异常的时候,HTTPError必须写在URLError之前,因为只有这样前者才能抛出异常,不然的话就会被后者拦截,提前抛出异常. from urllib.requ ...

  10. 利用jTessBoxEditor工具进行Tesseract-OCR样本训练

    jTessBoxEditor依赖java虚拟机 , 所以要先安装 java. jTessBoxEditor下载地址: https://sourceforge.net/projects/vietocr/ ...