EasyUI 下拉框(ComboBox)提供了很多方便的功能,包括搜索功能。您可以使用 EasyUI 提供的
filter
属性来实现下拉框搜索。
以下是一个简单的例子:
<input id="cc" class="easyui-combobox" data-options="
valueField: 'id',
textField: 'text',
url: 'get_data.php',
filter: function(q, row){
var opts = $(this).combobox('options');
return row[opts.textField].indexOf(q) >= 0;
在上面的例子中,filter
属性指定了搜索函数。filter
函数有两个参数,q
表示搜索关键字,row
表示下拉框中的每一行数据。在函数体中,我们首先获取下拉框的选项(通过 $(this).combobox('options')
),然后通过 indexOf
函数来判断当前行的文本内容是否包含搜索关键字。如果包含,则返回 true
,否则返回 false
。当返回值为 true
时,该行数据将会被保留下来,显示在下拉框中。
需要注意的是,上面的例子中,下拉框的数据是从 get_data.php
中获取的。您需要根据实际情况修改 url
参数,以获取正确的数据源。