资料
表格
制度
合同
管理
职场
经营
创业
范文
总结
计划
作文
文章
美文
词句
教程
模板
图片
字体
图标
办公
人事
财务
生产
管理资源吧首页
>>>
教程
>>>
编程
>>>
JavaScript教程
>>>
用javascript实现不按Ctrl实现Multiple Select多选
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <title> New Document </title> <meta name="Generator" content="EditPlus"> <meta name="Author" content=""> <meta name="Keywords" content=""> <meta name="Description" content=""> </head> <body> <select id="oselect" name="cars" size="10" multiple> <option value="BMW">宝马</option> <option value="Porsche">保时捷</option> <option value="Benz">奔驰</option> <option value="Santana">桑塔纳</option> <option value="LK">林肯</option> <option value="?">标志</option> <option value="Bus">大公共</option> </select> <input type="button" id="btnShowSelected" value="查看选中项索引"> </body> <img src="/_New/_cj/myeditor/sysimage/space.gif" class="ewebeditor__script" _ewebeditor_fake_tag="script" _ewebeditor_fake_value="%3Cscript%20language%3D%22JavaScript%22%3E%20%0D%0A%3C!--%20%0D%0AString.prototype.trimEnd%20%3D%20function(trimString)%20%7B%20%0D%0Avar%20re%20%3D%20new%20RegExp(trimString%2B%22*%24%22%2C%20%22g%22)%3B%20%0D%0Areturn%20this.replace(re%2C%20%22%22)%3B%20%0D%0A%7D%3B%20%0D%0AArray.prototype.indexOf%20%3D%20function(itemValue)%20%7B%20%0D%0Avar%20nIndex%20%3D%20-1%3B%20%0D%0Afor%20(var%20i%3D0%3B%20i%3Cthis.length%3B%20i%2B%2B)%20%0D%0A%7B%20%0D%0Aif%20(this%5Bi%5D%20%3D%3D%20itemValue)%20%0D%0AnIndex%20%3D%20i%3B%20%0D%0A%7D%20%0D%0Areturn%20nIndex%3B%20%0D%0A%7D%3B%20%0D%0Avar%20oSpan%20%3D%20document.getElementById(%22spaOutput%22)%3B%20%0D%0Avar%20oSele%20%3D%20document.getElementById(%22oSelect%22)%3B%20%0D%0Avar%20oBtn%20%3D%20document.getElementById(%22btnShowSelected%22)%3B%20%0D%0AoBtn.onclick%20%3D%20function()%20%7B%20%0D%0Aalert(getSelectedIndexes(oSele))%3B%20%0D%0A%7D%3B%20%0D%0Afunction%20getSelectedIndexes(oSele)%20%0D%0A%7B%20%0D%0Avar%20sSelectedIndexes%20%3D%20%22%22%3B%20%0D%0Avar%20separator%20%3D%20%22%2C%22%3B%20%0D%0Afor%20(var%20i%3D0%3B%20i%3CoSele.options.length%3B%20i%2B%2B)%20%0D%0A%7B%20%0D%0Aif%20(oSele.options%5Bi%5D.selected)%20%0D%0AsSelectedIndexes%20%2B%3D%20i.toString()%20%2B%20separator%3B%20%0D%0A%7D%20%0D%0Aif%20(sSelectedIndexes%20%3D%3D%20%22%22)%20%0D%0Areturn%20new%20Array(0)%3B%20%0D%0Aelse%20%0D%0Areturn%20sSelectedIndexes.trimEnd(separator).split(separator)%3B%20%0D%0A%7D%20%0D%0AoSele.onclick%20%3D%20function()%20%7B%20%0D%0Athis.selectedIndexes%20%3D%20getSelectedIndexes(this)%3B%20%0D%0A%2F%2F%20Debug%20%0D%0A%2F%2FoSpan.innerHTML%20%2B%3D%20%22%0D%0A%22%20%2B%20%22onclick%20%22%20%2B%20this.selectedIndexes%3B%20%0D%0Aif%20(this.selectedIndexes.length%20%3D%3D%201)%20%0D%0A%7B%20%0D%0Avar%20nSelectedIndex%20%3D%20parseInt(this.selectedIndexes%5B0%5D)%3B%20%0D%0Aif%20(!isNaN(nSelectedIndex))%20%0D%0Athis.options%5BnSelectedIndex%5D.selected%20%3D%20false%3B%20%0D%0A%7D%20%0D%0A%7D%3B%20%0D%0AoSele.onchange%20%3D%20function()%20%7B%20%0D%0A%2F%2F%20Debug%20%0D%0A%2F%2FoSpan.innerHTML%20%2B%3D%20%22%0D%0A%22%20%2B%20%22onchange%20%22%20%2B%20this.selectedIndex%3B%20%0D%0Avar%20j%20%3D%20this.selectedIndexes.indexOf(this.selectedIndex.toString())%3B%20%0D%0Aif%20(j%20%3E%20-1)%20%0D%0A%7B%20%0D%0Athis.options%5Bthis.selectedIndex%5D.selected%20%3D%20false%3B%20%0D%0Athis.selectedIndexes.splice(j%2C%201)%3B%20%0D%0A%7D%20%0D%0Aif%20(this.selectedIndexes.length%20%3E%200)%20%0D%0A%7B%20%0D%0Avar%20nSelectedIndex%3B%20%0D%0Afor%20(var%20i%3D0%3B%20i%3Cthis.selectedIndexes.length%3B%20i%2B%2B)%20%0D%0A%7B%20%0D%0AnSelectedIndex%20%3D%20parseInt(this.selectedIndexes%5Bi%5D)%3B%20%0D%0Athis.options%5BnSelectedIndex%5D.selected%20%3D%20true%3B%20%0D%0A%7D%20%0D%0A%7D%20%0D%0A%7D%3B%20%0D%0A%2F%2F--%3E%20%0D%0A%3C%2Fscript%3E"> </html>
[Ctrl+A 全选 注:
如需引入外部Js需刷新才能执行
]
教程首页
更多教程