BUI

其它版本:

API for BUI 1.6.x

Show:

bui.searchbar Class

搜索条

输入时会延迟执行.示例是 searchbar 跟 list 一起使用的场景.

预览地址: demo

方法说明:

search: 单独调用搜索方法
option: 获取设置参数
widget: 获取依赖控件
控件预览

Constructor

bui.searchbar

(
  • option
)

Parameters:

  • option Object
    • id String

      [控件id]

    • [handle] [点击的搜索按钮] String optional
    • [onInput] [ 实时搜索的回调] Function optional
    • [onChange] [ 1.5.4新增, 搜索改变的时候触发,在失去焦点后] Function optional
    • [onRemove] [ 移除关键词以后的回调] Function optional
    • [onBeforeInit] [ 1.5.1新增 初始化前触发] Function optional
    • [onInited] [ 1.5.1新增 初始化以后触发] Function optional
    • [callback] [ 点击按钮的回调] Function optional

Example:

html:

       <div id="searchbar" class="bui-searchbar">
                                           <div class="bui-input">
                                               <i class="icon-search"></i>
                                               <input type="text" value="" placeholder="搜索"/>
                                           </div>
                                       </div>
                                

js:

       // 初始化
                                       var uiSearchbar = bui.searchbar({ 
                                           id: "#searchbar",
                                           callback: function(e,keyword) {
                                               // 点击以后做什么事情
                                           }
                                         });
                                

Item Index

Events

Methods

destroy

(
  • [bool] [ 默认: false 销毁部分 | true 销毁全部]
)

Defined in src/scripts/ui/bui.searchbar.js:288

Available since 1.4.2

[销毁控件]

Parameters:

  • [bool] [ 默认: false 销毁部分 | true 销毁全部] Boolean optional

Example:

       //销毁
                                                   uiSearchbar.destroy();
                                            

init

(
  • [option] [参数控件本身]
)
chainable

初始化方法,用于重新初始化结构,事件只初始化一次

Parameters:

  • [option] [参数控件本身] Object optional

option

(
  • [key] [ 不传则获取所有参数, 类型为string,没有第2个参数则获取某个参数]
  • [value] [ 设置参数的时候要传,设置多个参数不用传,获取参数的时候也不用传]
)
chainable

获取设置参数

Parameters:

  • [key] [ 不传则获取所有参数, 类型为string,没有第2个参数则获取某个参数] String | object optional
  • [value] [ 设置参数的时候要传,设置多个参数不用传,获取参数的时候也不用传] String | number | boolean | function optional

Example:

       //获取所有参数
                                                   var option = uiSearchbar.option();
                                            
                                                   //获取某个参数
                                                   var id = uiSearchbar.option( "id" );
                                            
                                                   //修改一个参数
                                                   uiSearchbar.option( "handle",".btn-search" );
                                            
                                                   //修改多个参数
                                                   uiSearchbar.option( {"handle":".btn-search"} );
                                            

reset

(
  • [name] [ 依赖控件名]
)

Defined in src/scripts/ui/bui.searchbar.js:272

Available since 1.5.4

清空当前输入框的值

Parameters:

  • [name] [ 依赖控件名] String optional

Example:

      uiSearchbar.reset();
                                            

value

(
  • [name] [ 依赖控件名]
)

Defined in src/scripts/ui/bui.searchbar.js:251

Available since 1.5.3

获取当前输入框的值

Parameters:

  • [name] [ 依赖控件名] String optional

Example:

      var val = uiSearchbar.value();
                                            

widget

(
  • [name] [ 依赖控件名]
)

获取依赖的控件

Parameters:

  • [name] [ 依赖控件名] String optional

Example:

       //获取依赖控件
                                                   var uiSearchbarWidget = uiSearchbar.widget();
                                            

Events

off

Defined in src/scripts/ui/bui.searchbar.js:376

Available since 1.3.0

为控件取消绑定事件

Event Payload:

  • [type] [ 事件类型: "search"(搜索时触发) | "remove"(移除关键字时触发) | "input"(每次输入时触发)] String optional
  • [callback] [ 绑定的事件, this 为当前点击的菜单] Function optional

Example:

       uiSearchbar.off("show");
                                            

on

Defined in src/scripts/ui/bui.searchbar.js:356

Available since 1.3.0

为控件绑定事件

Event Payload:

  • [type] [ 事件类型: "search"(搜索时触发) | "remove"(移除关键字时触发) | "input"(每次输入时触发)] String optional
  • [callback] [ 绑定的事件, this 为当前点击的菜单] Function optional

Example:

       uiSearchbar.on("show",function () {
                                                       // 点击的菜单
                                                       console.log(this);
                                                   });