[問題] 有關下拉式選單的問題

看板Ajax作者 (881 forever)時間10年前 (2014/12/26 13:17), 編輯推噓1(101)
留言2則, 1人參與, 最新討論串1/1
各位大大好 小弟目前遇到一個問題 就是下拉式選單"多選"但"無法下拉"的問題, 目前在網路上找到一段sample code http://jsfiddle.net/51p7ocLw/ 它可以不用按著crtl(command on mac)就可以直接多選 但是,他沒有下拉式的感覺阿, 我想做到的效果是 就是向單選那樣會有一個下拉式選單 然後我可以不急不徐的在這下拉式選單裡多選 我試著把size設成1,也不行 大家有其他的方式嗎? 程式片段如下: <html> <head> <script type="text/javascript"> window.onmousedown = function (e) { var el = e.target; if (el.tagName.toLowerCase() == 'option' && el.parentNode.hasAttribute('multiple')) { e.preventDefault(); // toggle selection if (el.hasAttribute('selected')) el.removeAttribute('selected'); else el.setAttribute('selected', ''); // hack to correct buggy behavior var select = el.parentNode.cloneNode(true); el.parentNode.parentNode.replaceChild(select, el.parentNode); } } </script> </head> <body> <h4>From</h4> <div> <select name="sites-list" size="7" multiple> <option value="site-1">SITE</option> <option value="site-2" selected>SITE</option> <option value="site-3">SITE</option> <option value="site-4">SITE</option> <option value="site-5">SITE</option> <option value="site-6" selected>SITE</option> <option value="site-7">SITE</option> <option value="site-8">SITE</option> <option value="site-9">SITE</option> </select> </div> </body> </html> -- ※ 發信站: 批踢踢實業坊(ptt.cc), 來自: 140.112.29.187 ※ 文章網址: http://www.ptt.cc/bbs/Ajax/M.1419571039.A.E32.html

12/27 02:40, , 1F
在觸發事件時將select.size設成option的數量
12/27 02:40, 1F

12/27 02:41, , 2F
新增else項將select.size設回1
12/27 02:41, 2F
文章代碼(AID): #1KdEzVuo (Ajax)
文章代碼(AID): #1KdEzVuo (Ajax)