100字范文,内容丰富有趣,生活中的好帮手!
100字范文 > select实现多选 全选 全不选

select实现多选 全选 全不选

时间:2021-09-16 11:22:31

相关推荐

select实现多选 全选 全不选

今天使用select下拉框实现了全选,全不选和多选的功能,效果如图:

1、html代码:

为select标签设置multiple属性为true

<select id="myselect" multiple="true"><option value="1">java</option><option value="2">javaSE</option><option value="3">javaEE</option></select>

截图和代码不相符,因为我用的是struts2框架,使用的是<s:select>标签,直接使用list获取下拉选项的,这里只是说明一下问题。关于s:select标签可以参考下面这个链接:

s:select标签的使用和相关属性说明

2、js代码:

接下来就是在js中设置select标签的多选功能:

$("#myselect").multiselect({noneSelectedText : "--请选择--", //当没有内容选中时候显示的文本checkAllText : "全选", //全选按钮显示的文本uncheckAllText : "全不选", //全不选按钮显示的文本minWidth : 200, //select框的宽度,根据option的内容长短设置selectedList : 2 //当选中的内容超过2条时,显示“n已选择”});

别忘了引入js和css文件,这两个文件收了1大洋,木有积分的亲们可以加3393055725分享,下载地址:

/detail/cat_pp/9774366

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。