当前位置： 移动技术网 > IT编程>开发语言>JavaScript > select下拉框插件jquery.editable-select详解

select下拉框插件jquery.editable-select详解

2019年03月28日  | 移动技术网IT编程  | 我要评论

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

html代码

 <span>数据来源</span>
 <select class="source">
 <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：当下拉框中的选项被选中时触发。

参考地址：

  npm安装

  demo地址

  下载地址

以上就是本文的全部内容，希望本文的内容对大家的学习或者工作能带来一定的帮助，同时也希望多多支持移动技术网！

您可能感兴趣的文章:

如对本文有疑问， 点击进行留言回复！！

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网