bootstrap select僅顯示鏈接單擊時的下拉菜單，沒有選擇按鈕

Question

我有一個鏈接：

<a href="#" id="link">Click me</a>

當有人單擊鏈接時，我只想顯示下拉菜單，例如：

如何刪除按鈕？

JSFIDDLE

HTML：

<a href="#" id="link">Click me</a>

<div id="searchSelect">                     
    <select name="searchName" id="idSelect" data-live-search="true" data-size="10">
        <option value="">ALL</option>
        <option value="Tom">Tom</option>
        <option value="John">John</option>
        <option value="Janet">Janet</option>
    </select>
</div>  

CSS：

#searchSelect 
{
  z-index:999; 
  position:absolute; 
  display:none;
}

JS：

$("#idSelect").selectpicker();
$("#link").click(function(e) {
    e.preventDefault();
    $("#searchSelect").show();
});

$("#idSelect").change(function() {
    $("#searchSelect").hide();
});

Answer 1

我更新了答案，我認為這就是您想要的。 只需更新您的CSS。

https://jsfiddle.net/n1zz8kkw/2/

     #searchSelect {
      z-index: 999;
      position: absolute;
    }

    .bootstrap-select.btn-group .dropdown-toggle,
    .bootstrap-select.btn-group .dropdown-toggle:hover,
    .bootstrap-select.btn-group .dropdown-toggle:active,
    .bootstrap-select.btn-group .dropdown-toggle:focus {
      background: none !important;
      border: none !important;
      outline: 0px;
      box-shadow: none;
    }

    .bootstrap-select.btn-group .caret {
      display: none;
    }

    #searchSelect .btn.dropdown-toggle {
      height: 0px;
      padding: 0px;
    }

    .bootstrap-select.btn-group .filter-option {
      display: none !important;
    }

祝好運

Answer 2

如果您的意思是下拉箭頭，那么對於Chrome瀏覽器，您可以使用類似以下命令的內容：

<select style="-webkit-appearance: none;">

有關更多信息，請參見以下問題： 選擇刪除下拉箭頭 。