极客教程EasyUI jQuery linkbutton widget
EasyUI是一个HTML5框架，用于使用基于jQuery、React、Angular和Vue技术的用户界面组件。它有助于为交互式网络和移动应用程序构建功能，为开发者节省大量时间。
在这篇文章中，我们将学习如何使用jQuery EasyUI设计一个链接按钮。链接按钮是用来创建一个超链接按钮的。它是一个普通<a>标签的代表。它可以同时显示一个图标和文本，或者只显示图标或文本。
EasyUI for jQuery的下载：
https://www.jeasyui.com/download/index.php
语法:
<div class="linkbutton">
</div>
属性:
- width: 这个组件的宽度。
- height。该组件的高度。
- id。该组件的id属性。
- disabled:为真，禁用该按钮。
- toggle。真，使用户能够将其状态切换为选中或未选中。
- selected:定义按钮的状态是否被选中。
- group。表示按钮所属的组名。
- plain。真，以显示平淡的效果。
- text。按钮的文字。
- iconCls。一个CSS类，在左边显示一个16×16的图标。
- iconAlign：按钮图标的位置。
*size。
事件:
- onClick。当按钮被点击时启动。
方法:
- options :返回选项属性。
- resize : 调整按钮的大小。
- disable : 禁用该按钮。
- enable : 启用该按钮。
- select : 选择按钮。
- unselect : 取消选择该按钮。
CDN链接：首先，添加你的项目需要的jQuery Easy UI脚本。
<script type=”text/javascript” src=”jquery.min.js”> </script>
<!–jQuery libraries of EasyUI –>
<script type=”text/javascript” src=”jquery.easyui.min.js”> </script>
<!–jQuery library of EasyUI Mobile –>
<script type=”text/javascript” src=”jquery.easyui.mobile.js”> </script>
示例:
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="initial-scale=1.0,
maximum-scale=1.0, user-scalable=no">
<!-- EasyUI specific stylesheets-->
<link rel="stylesheet" type="text/css"
href="themes/metro/easyui.css">
<link rel="stylesheet" type="text/css"
href="themes/mobile.css">
<link rel="stylesheet" type="text/css"
href="themes/icon.css">
<!--jQuery library -->
<script type="text/javascript" src="jquery.min.js">
</script>
<!--jQuery libraries of EasyUI -->
<script type="text/javascript"
src="jquery.easyui.min.js">
</script>
<!--jQuery library of EasyUI Mobile -->
<script type="text/javascript"
src="jquery.easyui.mobile.js">
</script>
<script type="text/javascript">
(document).ready(function (){
('#gfg').linkbutton({
text: "GeeksforGeeks"
});
});
</script>
</head>
<body>
<h1>GeeksforGeeks</h1>
<h3>EasyUI jQuery linkbutton widget</h3>
<a href=
"https://www.geeksforgeeks.org/" id="gfg" class="easyui-linkbutton">
</a>
</body>
</html>
输出:
