天天看點

jquery手寫帶搜尋功能的下拉框(帶複選框)

工作需要寫一個帶搜尋功能的下拉框,而且下拉框還能供選擇,于是有了下一波的操作:

html代碼:

jquery手寫帶搜尋功能的下拉框(帶複選框)

這是下拉框部分代碼 頁面上通過點選顯示這一部分

jquery手寫帶搜尋功能的下拉框(帶複選框)

js代碼 : (點選選擇按鈕的事件)

jquery手寫帶搜尋功能的下拉框(帶複選框)

(為了點選其他地方關閉下拉框則有了如下的操作)

jquery手寫帶搜尋功能的下拉框(帶複選框)

我是把篩選的方法寫在請求的回調函數裡面的:

jquery手寫帶搜尋功能的下拉框(帶複選框)
jquery手寫帶搜尋功能的下拉框(帶複選框)

因為HTML規定select下面隻能用option,是以隻能用其他标簽拼接!!!

最終實作

jquery手寫帶搜尋功能的下拉框(帶複選框)

第一次寫技術部落格,可能描述的不是很清楚,有疑問的qq:1129478244 工作時間都線上