您当前的位置:首页 > 网站建设 > jQuery
| php | asp | css | H5 | javascript | Mysql | Dreamweaver | Delphi | 网站维护 | 帝国cms | React | 考试系统 | ajax | jQuery |

jQuery EasyUI 基础插件 - Searchbox 搜索框

51自学网 2023-01-16 20:14:29
  jQuery

通过 $.fn.searchbox.defaults 重写默认的 defaults。

搜索框(searchbox)提示用户输入搜索值。它可以结合一个码单,允许用户选择不同的搜索类别。当用户按下 ENTER 键时或者点击组件右侧的搜索按钮时,搜索动作将被执行。

依赖

  • menubutton

用法

创建搜索框(Searchbox)

1、从标记创建。把 'easyui-searchbox' class 加入到 <input> 标记。

<script type="text/javascript">    function qq(value,name){    alert(value+":"+name)    }</script><input id="ss" class="easyui-searchbox" style="width:300px"    data-options="searcher:qq,prompt:'Please Input Value',menu:'#mm'"></input><div id="mm" style="width:120px">    <div data-options="name:'all',iconCls:'icon-ok'">All News</div>    <div data-options="name:'sports'">Sports News</div></div>

2、编程创建。

<input id="ss"></input><div id="mm" style="width:120px">    <div data-options="name:'all',iconCls:'icon-ok'">All News</div>    <div data-options="name:'sports'">Sports News</div></div>
$('#ss').searchbox({    searcher:function(value,name){    alert(value + "," + name)    },    menu:'#mm',    prompt:'Please Input Value'});

属性

名称 类型 描述默认值
width number 组件的宽度。auto
height number 组件的高度。该属性自版本 1.3.2 起可用。22
prompt string 显示在输入框里的提示信息。''
value string 输入的值。''
menu selector 搜索类型的码单。每个码单项可以有下列的属性:
name:搜索类型名称。
selected:当前选择的搜索类型名称。

下面的实例演示了如何定义一个选中的搜索类型名称。
<input class="easyui-searchbox" style="width:300px" data-options="menu:'#mm'" /><div id="mm" style="width:150px">
下载地址:
jQuery EasyUI 基础插件 - Progressbar 进度条
jQuery EasyUI 基础插件 - Pagination 分页
51自学网,即我要自学网,自学EXCEL、自学PS、自学CAD、自学C语言、自学css3实例,是一个通过网络自主学习工作技能的自学平台,网友喜欢的软件自学网站。
京ICP备13026421号-1