编程那点事编程那点事

专注编程入门及提高
探究程序员职业规划之道!

easyui api中文文档:SearchBox

搜索框(SearchBox)

用$.fn.searchbox.defaults重写了Defaults 在搜索框提示用户输入搜索值,它可以结合一个菜单允许用户选择不同的搜索类目,搜索事件在用户按下回车键之后激活,当然也可以通过单击搜索组件右侧的搜索按钮触发。

依赖(Dependencies)

Menubutton

使用示例(Usage Example)

创建搜索框 通过在input标签上加上‘easyi-searchbox’类创建

All News
Sports News
通过javascript创建
All News
Sports News
$('#ss').searchbox({
searcher:function(value,name){
alert(value + "," + name)
},
menu:'#mm',
prompt:'Please Input Value'
},2);

属性(Properties)

Name Type Description Default
width number 组件的宽度 auto
height number 组件的高度,1.3.2新增的属性 22
prompt string 在input框中显示的提示信息 ''
value string 输入的值 ''
menu selector 搜索类型菜单,每个菜单项都有以下属性 Name:搜索类型的名字 Selected:当前选中的搜索类型的名字 下面的示例显示怎么定义一个选中的搜索类型名称
Search Item1
Search Item2
Search Item3
null
searcher function(value,name) 当用户点击搜索按钮或者按下回车键是触发搜索函数 null

方法(Methods)

Name Parameter Description
options none 返回options对象
menu none 返回搜索类型菜单对象。下面的示例显示了怎么改变菜单项的图标。 var m = $('#ss').searchbox('menu',2);? // get the menu object var item = m.menu('findItem', 'Sports News',2);? // find the menu item // change the menu item icon m.menu('setIcon', { ?????????????? target: item.target, ?????????????? iconCls: 'icon-save' },2); // select the searching type name $('#ss').searchbox('selectName', 'sports',2);
textbox none 返回textbox对象
getValue none 返回当前搜索的值
setValue value 设置新的搜索值
getName none 返回当前搜索类型名称
selectName name 选择当前搜索类型的名称 代码示例 $('#ss').searchbox('selectName', 'sports',2);
destroy none 销毁搜索组件
resize width 重置搜索组件的宽度
未经允许不得转载: 技术文章 » javascript » easyui api中文文档:SearchBox