开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

社区首页 >专栏 >select2的使用

select2的使用

晓果冻

发布于 2022-06-17 15:14:45

1.4K0

发布于 2022-06-17 15:14:45

举报

文章被收录于专栏：一直在努力的Java菜鸡er一直在努力的Java菜鸡er

首先放上select2的官方文档链接：https://select2.org/

通过cdn引入select2所需要的库，或者下载到本地引入。

<select class="js-example-basic-single" multiple="multiple" name="state">
  <option value="AL">Alabama</option>
    ...
  <!--<option ng-repeat="xxx in list">{{xxx}}</option>-->
  <option value="WY">Wyoming</option>
</select>

你必须在其它地方能获取到这个select标签，所以要为其设置id、class或者是name以便能得到这个标签。multiple属性是是否可以多选。option是下拉框中多选的内容。例如在angluar中，使用ng-repeat循环出来值xxx，然后放在option中供select使用。

js块可以这样使用，如下图所示:

$(document).ready(function() {
    $('.js-example-basic-multiple').select2({
     data:[{name:"张三"},{name:"里斯"}]
     //json格式的数据，当然也可以通过ajax从后端获取数据
    });
});

我上面是用的是angluar，所以直接在controller中为list赋值了。

$scoper.list=[
"值1","值2"
]
//当然也可以使用ajax从后端动他获取数据

本文参与腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。

如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自作者个人站点/博客前往查看

如有侵权，请联系 cloudcommunity@tencent.com 删除。

本文参与腾讯云自媒体同步曝光计划，欢迎热爱写作的你一起参与！

评论

登录后参与评论

0 条评论

热度

最新

LV.