使用$.fn.linkbutton.defaults重写默认值对象。
按钮组件使用超链接按钮创建。它使用一个普通的<a>标签进行展示。它可以同时显示一个图标和文本,或只有图标或文字。按钮的宽度可以动态和折叠/展开以适应它的文本标签。
使用案例
创建按钮
使用标签创建按钮更加简单。
- <a id="btn" href="#" class="easyui-linkbutton" data-options="iconCls:'icon-search'">easyui</a>
<a id="btn" href="#" class="easyui-linkbutton" data-options="iconCls:'icon-search'">easyui</a>
也可以使用Javascript创建按钮。
- <a id="btn" href="#">easyui</a>
- $('#btn').linkbutton({
- iconCls: 'icon-search'
- });
<a id="btn" href="#">easyui</a>
$('#btn').linkbutton({
iconCls: 'icon-search'
});
$('#btn').linkbutton({
iconCls: 'icon-search'
});
处理按钮的点击
点击按钮会将用户引导到其他页面。
- <a href="otherpage.php" class="easyui-linkbutton" data-options="iconCls:'icon-search'">easyui</a>
<a href="otherpage.php" class="easyui-linkbutton" data-options="iconCls:'icon-search'">easyui</a>
下面的示例提示了一个警告信息。
- <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-search'"
- onclick="javascript:alert('easyui')">easyui</a>
<a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-search'"
onclick="javascript:alert('easyui')">easyui</a>
onclick="javascript:alert('easyui')">easyui</a>
Bind click handler using jQuery.
- <a id="btn" href="#" class="easyui-linkbutton" data-options="iconCls:'icon-search'">easyui</a>
<a id="btn" href="#" class="easyui-linkbutton" data-options="iconCls:'icon-search'">easyui</a>
- $(function(){
- $('#btn').bind('click', function(){
- alert('easyui');
- });
- });
$(function(){
$('#btn').bind('click', function(){
alert('easyui');
});
});
$('#btn').bind('click', function(){
alert('easyui');
});
});
属性
| 属性名 | 属性值类型 | 描述 | 默认值 |
|---|---|---|---|
| id | string | 组件的ID属性。 | null |
| disabled | boolean | 为true时禁用按钮。 | false |
| plain | boolean | 为true时显示简洁效果。 | false |
| text | string | 按钮文字。 | '' |
| iconCls | string | 显示在按钮文字左侧的图标(16x16)的CSS类ID。 | null |
| iconAlign | string | 按钮图标位置。可用值有：'left','right'。（该属性自1.3.2版开始可用） | left |
方法
| 方法名 | 方法参数 | 描述 |
|---|---|---|
| options | none | 返回属性对象。 |
| disable | none | 禁用按钮。
代码示例： $('#btn').linkbutton('disable');
|
| enable | none | 启用按钮。
代码示例： $('#btn').linkbutton('enable');
|