6

私はこれで本当に苦労しています。誰か助けてくれませんか？

モバイル デバイス用にネイティブ ドロップダウンを開始したい

  1. http://jsfiddle.net/4UjVr/4/

  2. ドキュメント: http://silviomoreto.github.io/bootstrap-select/#mobile 

$(function() {
  $('#desktop').selectpicker({
    container: 'body'
  });
});
<link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>

<script src="https://dl.dropboxusercontent.com/u/120557/Expires/12-2014/bootstrap-select.js"></script>
<link href="http://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.5.4/bootstrap-select.min.css" rel="stylesheet" />


<select id="desktop" data-live-search="true">
  <option>cow</option>
  <option>bull</option>
  <option>cow</option>
  <option>Test2</option>
  <option>Tes3</option>
  <option>Tes4</option>

  <option class="get-class" disabled>ox</option>
  <optgroup label="test" data-subtext="another test" data-icon="icon-ok">
    <option>ASD</option>
    <option>Bla</option>
    <option>Ble</option>
  </optgroup>
</select>

モバイル デバイス用にネイティブ ドロップダウンを開始したい

4

3 に答える 3

0

Google からここに来る人は、モバイル オプションが有効になっているときにmobile-deviceクラスが自動的に に追加されることに注意してください。<select>

このクラスは、選択範囲をボタンと同じ幅と高さにし、選択範囲をボタンの上に (z-index を介して) 配置し、不透明度を 0 に設定して非表示にします。したがって、ボタンのように見えますが、クリックするとその上で、実際に選択をクリックしているため、ネイティブの選択メニューが開きます。

~ Github の問題に関するコメントからの直接の引用

プラグインは CSS を追加して、選択を上に上げてネイティブ ドロップダウンをトリガーするようにするだけなので、追加した可能性のあるカスタム CSS は、z-index別の要素の上位など、プラグインの CSS を上書きする可能性があります。私の場合。

カスタム CSS を削除すると、ネイティブ ドロップダウンが表示されないというさらなる問題が解決されます。

于 2021-08-12T01:49:22.153 に答える