blocks|key|1812700|text|1)你包含javascript文件了吗？如果使用CDN或下载CDN，请确保包含jquery、bootstrap和bootstrap-select。一旦正确设置，并将selectpicker类设置为select元素，它将自动初始化bootstrap-select。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1812701|2)如果仅设置自定义类的样式，请使用：|1812702|$('.my-custom').selectpicker();|code-block|syntax|javascript|1812703|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|L|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|M|8|@]|9|@]|A|$G|H]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

<p>1) Did you include the javascript file? If using CDN or download it, please make sure to include jquery, bootstrap, and the bootstrap-select. Once set up correctly, with the selectpicker class to your select elements, it will   auto-initialize bootstrap-select.</p>

<p>2) If to style only custom class, use:</p>

<pre><code>$('.my-custom').selectpicker();
</code></pre>


blocks|key|1598488|text|抱歉，如果你的问题已经回答了，但一个代码片段可能会有所帮助？|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1598489|​|1598490|$(function+()+{
++++$('.selectpicker').selectpicker();
});|code-block|syntax|javascript|1598491|<link+rel="stylesheet"+href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/css/bootstrap.min.css"+integrity="sha256-YLGeXaapI0/5IgZopewRJcFXomhRMlYYjugPLSyNjTY="+crossorigin="anonymous"+/>
<link+rel="stylesheet"+href="https://cdn.jsdelivr.net/npm/bootstrap-select@1.13.9/dist/css/bootstrap-select.min.css">


<select+class="selectpicker"+multiple>
++++<option>Mustard</option>
++++<option>Ketchup</option>
++++<option>Relish</option>
</select>

<script+src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"+integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="+crossorigin="anonymous"></script>
<script+src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js"+integrity="sha384-b/U6ypiBEHpOf/4%2B1nzFpr53nxSS%2BGLCkfwBdFNTxtclqqenISfwAzpKaMNFNmj4"+crossorigin="anonymous"></script>
<script+src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/js/bootstrap.min.js"+integrity="sha256-CjSoeELFOcH0/uxWu6mC/Vlrc1AARqbm/jiiImDGV3s="+crossorigin="anonymous"></script>
<script+src="https://cdn.jsdelivr.net/npm/bootstrap-select@1.13.9/dist/js/bootstrap-select.min.js"></script>|1598492|1598493|entityMap^0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|N|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|O|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|P|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|F|7|Q|8|@]|9|@]|A|$G|H]]|$1|K|3|C|5|6|7|R|8|@]|9|@]|A|$]]|$1|L|3|-4|5|6|7|S|8|@]|9|@]|A|$]]]|M|$]]

<p>Sorry if you question is already answered, but a snippet might help ?</p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>$(function () {
    $('.selectpicker').selectpicker();
});</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha256-YLGeXaapI0/5IgZopewRJcFXomhRMlYYjugPLSyNjTY=" crossorigin="anonymous" /&gt;
&lt;link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-select@1.13.9/dist/css/bootstrap-select.min.css"&gt;


&lt;select class="selectpicker" multiple&gt;
    &lt;option&gt;Mustard&lt;/option&gt;
    &lt;option&gt;Ketchup&lt;/option&gt;
    &lt;option&gt;Relish&lt;/option&gt;
&lt;/select&gt;

&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"&gt;&lt;/script&gt;
&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js" integrity="sha384-b/U6ypiBEHpOf/4+1nzFpr53nxSS+GLCkfwBdFNTxtclqqenISfwAzpKaMNFNmj4" crossorigin="anonymous"&gt;&lt;/script&gt;
&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha256-CjSoeELFOcH0/uxWu6mC/Vlrc1AARqbm/jiiImDGV3s=" crossorigin="anonymous"&gt;&lt;/script&gt;
&lt;script src="https://cdn.jsdelivr.net/npm/bootstrap-select@1.13.9/dist/js/bootstrap-select.min.js"&gt;&lt;/script&gt;</code></pre>
</div>
</div>
</p>


blocks|key|1598692|text|我终于想通了。当你为你的超文本标记语言文件抓取Bootstrap.js、jQuery和Popper时，它们的顺序必须是：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1598693|<script+src="jquery-3.3.1.slim.min.js">+++<script+src="popper.min.js">++<script+src="bootstrap.min.js">|offset|length|style|CODE|1598694|否则某些东西就不能工作了。一旦我改变了这一点，selectpicker就可以正常工作了。|1598695|entityMap^0|0|0|2V|0|0^^$0|@$1|2|3|4|5|6|7|L|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|M|8|@$D|N|E|O|F|G]]|9|@]|A|$]]|$1|H|3|I|5|6|7|P|8|@]|9|@]|A|$]]|$1|J|3|-4|5|6|7|Q|8|@]|9|@]|A|$]]]|K|$]]

<p>I finally figured it out. When you're grabbing Bootstrap.js, jQuery, and Popper for your HTML file, they <em>have</em> to be in this order:</p>

<p><code>&lt;script src="jquery-3.3.1.slim.min.js"&gt; 
 &lt;script src="popper.min.js"&gt;
 &lt;script src="bootstrap.min.js"&gt;</code></p>

<p>Or else certain things won't work. Once I changed this, selectpicker worked fine.</p>


<p>I'm trying to use selectpicker from Bootstrap-Select to make a multi-select dropdown menu. Here is what I have in my HTML file:</p>

<pre><code>&lt;select class="selectpicker" multiple&gt;
    &lt;option&gt;Mustard&lt;/option&gt;
    &lt;option&gt;Ketchup&lt;/option&gt;
    &lt;option&gt;Relish&lt;/option&gt;
&lt;/select&gt;
</code></pre>

<p>But this is what I get on my web app:</p>

<p><a href="https://i.stack.imgur.com/6nUAN.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/6nUAN.png" alt="enter image description here"></a></p>

<p>I can't hit the dropdown menu, it's disabled. How do I get this menu to be enabled?</p>


Selectpicker (bootstrap-select) doesn't work, shows a disabled menu?

jQuery

我正在尝试使用从Bootstrap-Select中选择选择器来创建一个多选下拉菜单。下面是我的HTML文件中的内容：<select class="selectpicker" multiple>    <option>Mustard</option>    <option>Ketchup</option>    <opt...

问选择器(bootstrap-select)不工作，显示禁用的菜单？
EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问选择器(bootstrap-select)不工作，显示禁用的菜单？EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问选择器(bootstrap-select)不工作，显示禁用的菜单？
EN