前言
jQuery Chosen插件是一个非常流行的前端多选下拉框组件，它提供了丰富的定制化和样式配置，但默认情况下会包含一个搜索框。然而，在某些情况下，我们可能并不需要这个搜索框，那么如何去除呢？本文将介绍一种简单易用的实现方法。
实现方法
第一步：修改CSS样式
首先，我们需要在样式上进行修改，隐藏搜索框。这可以通过以下CSS代码来实现：
.chosen-container .chosen-search {
display: none;
}第二步：初始化Chosen插件
接下来，我们需要初始化Chosen插件，并配置一些参数。具体来说，我们需要设置disable_search参数为true，以禁用搜索功能。同时，我们还需要注意调整容器宽度和高度，以确保其适应我们的设计需求。
$(document).ready(function() {
$(".chosen-select").chosen({
disable_search: true,
width: "100%",
height: "auto"
});
});这里我们假设多选下拉框对应的HTML元素是.chosen-select。
完整示例代码
最后，让我们来看一下完整的示例代码：
-- -------------------- ---- -------
--------- -----
----- ----------
------
----- ----------------
------------- ------ ------ ------- ------ -------------
----- ---------------- --------------------------------------------------------------------------
------- -----------------------------------------------------------
------- ----------------------------------------------------------------------------------------
-------
----------------- -------------- -
-------- -----
-
--------
-------
------
------- --------------------- ---------
-------------- ----------
-------------- ----------
-------------- ----------
-------------- ----------
-------------- ----------
---------
--------
---------------------------- -
----------------------------
--------------- -----
------ -------
------- ------
---
---
---------
-------
-------结论
通过以上的实现方法，我们可以很容易地去除Chosen插件中的搜索框。这种方法简单易用，同时还具有一定的指导意义，可以让我们更好地了解和使用前端多选下拉框组件。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/28807