因为业务需求,本人在工作中需要将select选择框变成可编辑可输入的。但浏览器默认的select是不能编辑的,也不能输入的。为了实现可编辑可输入的功能,本人使用jquery实现了和浏览器select类似的功能,并且可以编辑,可以输入。下载地址:https://codeload.github.com/feshy2013/jquery.editable-select/zip/master。里面有使用用例。
例如,下面的一个select
<select name = "drpPublisher2" >
<option value="3225">afgef</option>
<option value="3223">adfge</option>
<option value="1036">adssy</option>
<option value="1035">adsa1</option>
<option value="1034">ace00</option>
<option value="1033">abcd2</option>
<option value="1032">abcd1</option>
<option value="1031">a8181</option>
</select>
使用jquery调用:
$('#drpPublisher2').editableSelect(
{
bg_iframe: true, //是否加iframe
onSelect: function(list_item) {
//当改变select下拉选项值的时候调用
$('#ddd2').val(this.text.val());
},
case_sensitive: false, // 是否匹配
items_then_scroll: 10 ,// 设置下拉选项的数目
isFilter:true //是否根据条件过滤下拉选项
}
);
如果想看实现的效果,请下载:https://codeload.github.com/feshy2013/jquery.editable-select/zip/master,
运行demo.html文件。
本文介绍了一种使用jQuery实现的可编辑、可输入的select选择框功能,通过一个具体示例展示了如何将其应用于已有select元素上,以增强用户体验。
558

被折叠的 条评论
为什么被折叠?



