自动搜索下拉框

自动搜索 例子见自动搜索框例子

npm install --save jq-autosearch 例1：

<input type="text" class="autosearch"><input type="hidden" name="hd_id" id="hd_id"> <script src="../src/jquery-1.11.2.js"></script> <script src="../src/autosearch.js"></script> <script> $.get('data.txt',function(result){ var input = $('.autosearch'); var autosearch = new AutoSearch(); autosearch.init({input:input,autoShow:true,data:result,valueObj:'#hd_id',valueName:"id"}); },'json') </script>

直接的调用,使用静态固定的数据源

<!-- ajax请求 --> <input type="text" class="autosearch2"> <script> var input = $('.autosearch2'); var autosearch = new AutoSearch(); autosearch.init({input:input ,autoShow:false,data:function(callback){ $.get('data.txt',{key:input.val()},function(result){ callback(result); },'json'); } }); </script>

数据源会变化

<!-- 多个 --> <input type="text" class="autosearch3"> <script> $.get('data.txt',function(result){ var input = $('.autosearch3'); var autosearch = new AutoSearch(); autosearch.init({input:input,autoShow:false,data:result,mutil:true }); },'json') </script> 属性 input: [DOM]

输入框,jquery DOM对象 data:[obj|function]

数据源，这里可以传入数据源数组，也可以传入一个方法作为回调返回数据，如果传入的是数组，将作为静态过滤筛选，如果是传入的方法，每次都会调用该方法进来过滤。 autoShow:[bool]

是否在获得焦点时就显示数据,默认为false valueObj:[DOM]

赋值框，jquery DOM对象 filterColumn:[array string]

过滤的字段列，默认为['name'],可以同时对多个数据列过滤 column:[array string]

显示的列，默认为['name']，如果想定义显示项，可以配置回调方法format:function(item)来返回显示内容 mutil:[bool]

选多个，默认为false min:1

最少几个字符开始搜索 valueName:name

要显示在列表里的值. 回调方法 callback :function(data)

选中的回调，data为当前选中的数据项.可以用于扩展选中后的显示效果 focusCallback:function(input)

获取焦点 blurCallback:function(input)

离开焦点 showCallback:function(input,content)

显示后的回调 resetCallback:function(input)

this,没选择的重置回调