javascript - jQuery select2 插件使用 display:none

Question

我正在使用select2插件，但我很难做到style="display:none"。

这是我的代码：

$(document).ready(function () {
   $(".selectPretty").select2({
   }); 
});

<select class="selectPretty" name="charge_to">
      <option selected style="display:none">Need to hide</option>
      <option>Another Data</option>
</select>

Answer 1

当您呈现 select2 时，通常会生成此 html：

<div class="select2-container" id="s2id_my_unique_id" style="width: 67%;"><a href="javascript:void(0)" onclick="return false;" class="select2-choice" tabindex="-1">   <span>Select me!</span><abbr class="select2-search-choice-close" style="display:none;"></abbr>   <div><b></b></div></a><input class="select2-focusser select2-offscreen" type="text"><div class="select2-drop select2-with-searchbox" style="display:none">   <div class="select2-search">       <input type="text" autocomplete="off" class="select2-input">   </div>   <ul class="select2-results">   </ul></div></div>

如果没有在 html 中为您的选择定义 id，那么它通常会生成一个像“s2id_autogen1”这样的 id。

这是使用 CSS 隐藏它的 JSFiddle 以及要使用的 jQuery 选择器：

http://jsfiddle.net/bitclaw/SLvA7/