一、加载组件

1.使用class加载

<a href="#" class="easyui-linkbutton">按钮</a>

2.使用js加载

<a href="#" id="btn"></a>
<script>
$(function () {
$("#btn").linkbutton({
text: "按钮"
});
})
</script>

二、属性

1.id,disabled,text,iconCls,iconAlign,plain

<a href="#" id="btn"></a>
<script>
$(function () {
$("#btn").linkbutton({
//默认为null
id: "pox",
//为true时禁用按钮
disabled: true,
//按钮文字
text: "按钮",
//按钮图标,css类的id
iconCls: "icon-add",
//图标在文字的右侧(left,right)
iconAlign: "right",
//为true时,显示简洁效果
plain: true
});
})
</script>

生成的html

<a id="pox" class="l-btn l-btn-small l-btn-plain l-btn-disabled l-btn-plain-disabled" href="javascript:void(0)" group="">
<span class="l-btn-left l-btn-icon-right">
<span class="l-btn-text">按钮</span>
<span class="l-btn-icon icon-add"> </span>
</span>
</a>

2.toggle:设置true则运行用户切换气状态是否被选中,可实现checkbox复选功能效果,默认为false

<a href="#" id="btn1">C#</a>
<a href="#" id="btn2">Java</a>
<script>
$(function () {
$("#btn1").linkbutton({
toggle: true
});
$("#btn2").linkbutton({
toggle: true
});
})
</script>

3.group:指定相同组名的按钮同属于一个组,可实现radio单选效果

<a href="#" id="btn1">男</a>
<a href="#" id="btn2">女</a>
<script>
$(function () {
$("#btn1").linkbutton({
toggle: true,
group: "sex"
});
$("#btn2").linkbutton({
toggle: true,
group: "sex"
});
})
</script>

4.selected:定义按钮的选中状态

三、方法

1.options:

<a href="#" id="btn"></a>
<script>
$(function () {
$("#btn").linkbutton({ });
console.log($("#btn").linkbutton("options"));
})
</script>

输出的内容如下

2.disable

3.enable

四、设置默认值

$.fn.linkbutton.defaults.plain = true;

EasyUI系列学习(七)-Linkbutton(按钮)的更多相关文章

  1. 第二百零七节,jQuery EasyUI,MenuButton(菜单按钮)组件

    jQuery EasyUI,MenuButton(菜单按钮)组件 学习要点: 1.加载方式 2.属性列表 3.方法列表 本节课重点了解 EasyUI 中 MenuButton(菜单按钮)组件的使用方法 ...

  2. 第一百九十七节,jQuery EasyUI,LinkButton(按钮)组件

    jQuery EasyUI,LinkButton(按钮)组件 学习要点: 1.加载方式 2.属性列表 3.方法列表 本节课重点了解 EasyUI 中 LinkButton(按钮)组件的使用方法,这个组 ...

  3. jQuery EasyUI,LinkButton(按钮)组件

    转自:https://www.cnblogs.com/adc8868/p/6639570.html jQuery EasyUI,LinkButton(按钮)组件 学习要点: 1.加载方式 2.属性列表 ...

  4. 第二百零八节,jQuery EasyUI,SplitButton(分割按钮菜单)组件

    jQuery EasyUI,SplitButton(分割按钮)组件 学习要点: 1.加载方式 2.属性列表 3.方法列表 本节课重点了解 EasyUI 中 SplitButton(分割按钮)组件的使用 ...

  5. datebox清除按钮,datebox加上清除按钮,easyui datebox加上清除按钮

    datebox加上清除按钮,easyui datebox加上清除按钮 >>>>>>>>>>>>>>>>& ...

  6. EasyUI - LinkButton 按钮控件

    效果: html代码: <div> <a href ="abc.html" id="btn">添加</a> </div ...

  7. easyui datagrid列使用按钮的一些心得 .

    以前,用easyui的datagrid,有时候会用到一些操作选项,比如代码如下: $('#datagrid').datagrid({ border:false, fitColumns:true, si ...

  8. easyui datagrid列使用按钮的一些心得(转)

    http://blog.csdn.net/sskicgah/article/details/16939959 以前,用easyui的datagrid,有时候会用到一些操作选项,比如代码如下: $('# ...

  9. EasyUI系列学习笔记(一)——注册

    前面介绍过EasyUI是一个前段框架,开发之前需要导入底层包:我这里采用的是EasyUI 1.4版本~ 今天主要是搭建一个EasyUI的环境,同时做一个登陆页面... 环境搭建 导入需要的文件到项目中 ...

随机推荐

  1. JSP标准标签库(JSTL)

    JSTL:JSP Standard Tag Library:JSP标准标签库 以下内容引用自http://wiki.jikexueyuan.com/project/jsp/standard-tag-l ...

  2. cn_windows_10_multiple_editions_version_1607_updated_jul_2016_x64

    ed2k://|file|cn_windows_10_multiple_editions_version_1607_updated_jul_2016_x64_dvd_9056935.iso|43471 ...

  3. 我的arcgis培训照片10

    来自:http://www.cnblogs.com/gisoracle/p/4297439.html

  4. [Java Sprint] Spring XML Configuration : Constructor Injection Demo

    Previous we see how to do Setter injection: https://www.cnblogs.com/Answer1215/p/9472117.html Now le ...

  5. Linux学习日志--文件搜索命令

    开头总结: 学习了Linux中的文件搜索命令find和locate,系统搜索命令whereis 和which ,字符串搜索命令grep,find和locate的差别和使用方法格式,什么是path环境变 ...

  6. mysql正则表达式及应用

    mysql where子句的模式匹配 今天在应用中遇到了这样的一个问题,有一个字段 t1,其中的值类似于:1,1,1,2,3,3,4,4,5,5,2,4,3,2,1,2 需要从里面搜索出比如说:第一个 ...

  7. 复合页( Compound Page )

    复合页(Compound Page)就是将物理上连续的两个或多个页看成一个      独立的大页,它能够用来创建hugetlbfs中使用的大页(hugepage).      也能够用来创建透明大页( ...

  8. Zend Studio如何调试?

    1.安装Zend Studio之前,本机已安装Apache2.如果使用Apache2作为服务器 Window-Preferences-Php-Php Servers 配置好 URL和Server Ro ...

  9. ssh服务常见问题及其解决办法

    1 统一解决办法 执行sshd -t,这样就可以指出是哪里出问题了. 所有的服务都应该有这个测试选项,否则出错了都不知道在哪里出的问题. 2 root用户登录,密码是对的,但是报“Permission ...

  10. ffmpeg resize and scale

    ffmpeg缩小视频尺寸 | 楚盟博客 https://www.5yun.org/13126.html ffmpeg -i test.mp4 -s 480×360 out.mp4 常用分辨率: 108 ...