jquery easy-ui linkbutton 按钮的使用

最新推荐文章于 2023-04-21 08:43:08 发布

sd6275832ght

最新推荐文章于 2023-04-21 08:43:08 发布

阅读量1.1k

点赞数

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/sd6275832ght/article/details/84313302

本文详细介绍了如何在EasyUI框架中使用LinkButton组件，包括通过JS和CSS创建按钮的方法，以及如何绑定单击事件。此外，还介绍了LinkButton的各种属性和方法，如禁用、启用、选中和取消选中等。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

首先引入相应的js 和 css

  <link href="css/themes/default/easyui.css" rel="stylesheet" type="text/css" />    
    <link href="css/themes/icon.css" rel="stylesheet" type="text/css" />
    <script src="jq/jquery.min.js" type="text/javascript"></script>
    <script src="jq/jquery.easyui.min.js" type="text/javascript"></script>

使用js 的方式创建linkbutton

  $('#btn1').linkbutton({
                iconCls: 'icon-save'
            });
 <a id="btn1" href="javascript:void(0)">点击了我</a>

使用css的方式创建linkbutton

 <a id="btn"  class="easyui-linkbutton" data-options:"iconCls:'icon-search'" href="#">easyui</a>

给按钮绑定单击事件

  $('#btn1').bind('click', function () {
           //单击按钮触发该事件
            });

linkbutton其他属性和方法
名称类型描述默认值
disabled boolean 如果设置为 true，则禁用按钮。 false
toggle boolean 如果设置为 true，则允许用户切换按钮的选中状态。该属性自版本 1.3.3 起可用。 false
selected boolean 定义按钮状态是否已选择。该属性自版本 1.3.3 起可用。 false
group string 指示按钮所属的分组名称。该属性自版本 1.3.3 起可用。 null
plain boolean 如果设置为 true，则显示一个简单的效果。 false
text string 按钮文本。 ‘’
iconCls string 在左边显示一个 16x16 图标的 CSS class。 null
iconAlign string 按钮图标的位置。可能的值：‘left’、‘right’。该属性自版本 1.3.2 起可用。 left

方法

禁用按钮。
代码实例：
$(’#btn’).linkbutton(‘disable’);
启用按钮。
代码实例：
$(’#btn’).linkbutton(‘enable’);
select none 选中按钮。该方法自版本 1.3.3 起可用。
unselect none 未选中按钮。该方法自版本 1.3.3 起可用。