LinkButton（按钮）

使用$.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' });

处理按钮的点击

点击按钮会将用户引导到其余页面。

<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>

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'); }); });

 

属性

属性名	属性值类型	描述	默认值
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');