easyui创建链接按钮(Link Button)
Normally a button is created using <button/> element. A link button is created using <a/> element, so in fact a link button is a <a/> element but show a button style.
通常一个按钮是通过< button/ >元素来创建的。创建一个链接按钮使用<a/ >元素, 所以事实上一个链接按钮是一个< a/ >元素, 但显示一个按钮样式。
链接按钮的效果:
To create a link button, all you want to do is to add the class attribute named 'easyui-linkbutton' to the <a/> element:
创建一个链接按钮,你所要做的就是给< a/ >元素添加“easyui-linkbutton” 样式:
<div style="padding:5px;background:#fafafa;width:500px;border:1px solid #ccc"> <a href="#" class="easyui-linkbutton" iconCls="icon-cancel">Cancel</a> <a href="#" class="easyui-linkbutton" iconCls="icon-reload">Refresh</a> <a href="#" class="easyui-linkbutton" iconCls="icon-search">Query</a> <a href="#" class="easyui-linkbutton">text button</a> <a href="#" class="easyui-linkbutton" iconCls="icon-print">Print</a> </div> <div style="padding:5px;background:#fafafa;width:500px;border:1px solid #ccc"> <a href="#" class="easyui-linkbutton" plain="true" iconCls="icon-cancel">Cancel</a> <a href="#" class="easyui-linkbutton" plain="true" iconCls="icon-reload">Refresh</a> <a href="#" class="easyui-linkbutton" plain="true" iconCls="icon-search">Query</a> <a href="#" class="easyui-linkbutton" plain="true">text button</a> <a href="#" class="easyui-linkbutton" plain="true" iconCls="icon-print">Print</a> <a href="#" class="easyui-linkbutton" plain="true" iconCls="icon-help"></a> <a href="#" class="easyui-linkbutton" plain="true" iconCls="icon-save"></a> <a href="#" class="easyui-linkbutton" plain="true" iconCls="icon-back"></a> </div> |
As you can see, the iconCls attribute is a icon CSS class that show an icon image on button.
如您所见, iconCls属性是一个图标css样式, 将button显示为icon图标的css样式。
有时你决定禁用或启用某个链接按钮, 可以使用下面的代码禁用链接按钮:
$(selector).linkbutton('disable'); |