天天看点

jquery手写带搜索功能的下拉框(带复选框)

工作需要写一个带搜索功能的下拉框,而且下拉框还能供选择,于是有了下一波的操作:

html代码:

jquery手写带搜索功能的下拉框(带复选框)

这是下拉框部分代码 页面上通过点击显示这一部分

jquery手写带搜索功能的下拉框(带复选框)

js代码 : (点击选择按钮的事件)

jquery手写带搜索功能的下拉框(带复选框)

(为了点击其他地方关闭下拉框则有了如下的操作)

jquery手写带搜索功能的下拉框(带复选框)

我是把筛选的方法写在请求的回调函数里面的:

jquery手写带搜索功能的下拉框(带复选框)
jquery手写带搜索功能的下拉框(带复选框)

因为HTML规定select下面只能用option,所以只能用其他标签拼接!!!

最终实现

jquery手写带搜索功能的下拉框(带复选框)

第一次写技术博客,可能描述的不是很清楚,有疑问的qq:1129478244 工作时间都在线