Select2插件的隐藏、设置宽度

2018-07-28 06:27:59来源:博客园 阅读 ()

新老客户大回馈,云服务器低至5折

<select id="selPrinvice" class="Select2 select2-hidden-accessible" style="width:120px;" data-select2-id="selPrinvice" tabindex="-1" aria-hidden="true"><option value="" data-select2-id="4">请选择</option></select>
<span class="select2 select2-container select2-container--default" dir="ltr" data-select2-id="3" style="width: 120px; display: none;"
><span class="selection"><span class="select2-selection select2-selection--single" role="combobox" aria-haspopup="true" aria-expanded="false" tabindex="0" aria-labelledby="select2-selPrinvice-container">
<span class="select2-selection__rendered" id="select2-selPrinvice-container" role="textbox" aria-readonly="true" title="请选择">请选择</span><span class="select2-selection__arrow" role="presentation"><b role="presentation"></b></span></span></span><span class="dropdown-wrapper" aria-hidden="true"></span></span>

 浏览器开发者模式发现,使用select2插件后,你看到的下拉框是span,真正的下拉框select是隐藏掉了。

所以要隐藏下拉框应该设置最外面的span隐藏。比如我的设置如下:

  $("#selPrinvice").next().css("display", "none"); //下拉框的后面一个元素隐藏

 同理:设置宽度,也应该设置span。不过一开始在select写style="width:300px"时,在渲染成select2插件过程中,span的width取自于当前select的宽度。

标签:

版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有

上一篇:js练习——图片切换

下一篇:vue.js学习笔记1——安装及创建并运行vue实例