easyUI(6)linkbutton控件

最新推荐文章于 2022-05-09 20:24:04 发布

worn.xiao

最新推荐文章于 2022-05-09 20:24:04 发布

阅读量1.4k

点赞数

文章标签： easyui javascript ecmascript

原文链接：https://mp.csdn.net/mp_blog/creation/editor/61421368

版权

<!DOCTYPE html>
<html>
<head>
<title>jQuery Easy UI</title>
<meta charset="UTF-8" />
<script type="text/javascript" src="easyui/jquery.min.js"></script>
<script type="text/javascript" src="easyui/jquery.easyui.min.js"></script>
<script type="text/javascript" src="easyui/locale/easyui-lang-zh_CN.js" ></script>
<script type="text/javascript" src="js/index.js"></script>
<link rel="stylesheet" type="text/css" href="easyui/themes/default/easyui.css" />
<link rel="stylesheet" type="text/css" href="easyui/themes/icon.css" />
</head>
<body>
	<a id="box" href="###" class="easyui-linkbutton">按钮</a>
</body>
</html>

$(function () {
	
	$('#box').linkbutton({
			id:'pox' //组件的id属性
			text:'提交'//按钮文件 默认为空字符串
			disabled : true,//是否为禁止按钮
			toggle : true,//是否可以允许它像复选框一样可以切换
			selected : true,//定义按钮的选中状态true选中 false为未被选中
			group : 'sex',//是否让它实现radio button的效果
			plain : true,//设置为true的时候显示简介效果
			iconCls : 'icon-add',//设置按钮的图标的css类
			iconAlign : 'right',//设置图标默认的摆放位置
			//返回tip 元素对象
			onShow : function () {
				console.log($('#box').tooltip('tip'));
			}
     });
		
});

//返回属性对象
console.log($('#box').linkbutton('options'));
//禁用按钮
$('#box').linkbutton('disable');
//启用按钮
$('#box').linkbutton('enable');
//选择按钮
$('#box').linkbutton('select');
//取消选择按钮
$('#box').linkbutton('unselect');
//设置默认的连接按钮图标
$.fn.linkbutton.defaults.iconCls = 'icon-add';