jQuery EasyUI 擴(kuò)展 – Ribbon

2018-09-20 15:23 更新

jQuery EasyUI 擴(kuò)展 - Ribbon


jQuery EasyUI 擴(kuò)展 jQuery EasyUI 擴(kuò)展

包含 Ribbon 文件

如需創(chuàng)建 Ribbon 組件,則要包含 'ribbon.css'、'ribbon-icon.css' 和 'jquery.ribbon.js' 文件。

<link rel="stylesheet" type="text/css" href="http://m.hgci.cn/try/jeasyui/themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="http://m.hgci.cn/try/jeasyui/themes/icon.css">
<link rel="stylesheet" type="text/css" href="ribbon.css">
<link rel="stylesheet" type="text/css" href="ribbon-icon.css">
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.0.min.js" rel="external nofollow" ></script>
<script type="text/javascript" src="http://m.hgci.cn/try/jeasyui/jquery.easyui.min.js"></script>
<script type="text/javascript" src="jquery.ribbon.js"></script>

創(chuàng)建 Ribbon

從標(biāo)記創(chuàng)建。

    <div class="easyui-ribbon" style="width:700px;">
    <div title="Home">
    <div class="ribbon-group">
    <div class="ribbon-toolbar">
    <a href="#" class="easyui-menubutton" data-options="name:'paste',iconCls:'icon-paste-large',iconAlign:'top',size:'large'">Paste</a>
    </div>
    <div class="ribbon-toolbar">
    <a href="#" class="easyui-linkbutton" data-options="name:'cut',iconCls:'icon-cut',plain:true">Cut</a><br>
    <a href="#" class="easyui-linkbutton" data-options="name:'copy',iconCls:'icon-copy',plain:true">Copy</a><br>
    <a href="#" class="easyui-linkbutton" data-options="name:'format',iconCls:'icon-format',plain:true">Format</a>
    </div>
    <div class="ribbon-group-title">Clipboard</div>
    </div>
    <div class="ribbon-group-sep"></div>
    <div class="ribbon-group">
    <div class="ribbon-toolbar" style="width:200px"></div>
    <div class="ribbon-group-title">other title</div>
    </div>
    <div class="ribbon-group-sep"></div>
    </div>
    </div>

使用 javascript 創(chuàng)建。

    <div id="rr" style="width:700px;"></div>
    <script>
    $(function(){
    $('#rr').ribbon({
    data:data
    });
    });
    </script>

屬性

該屬性擴(kuò)展自標(biāo)簽頁(yè)(tabs),下面是為 Ribbon 添加的屬性。

名稱 類型 描述 默認(rèn)值
data object ribbon 的描述對(duì)象。 undefined

事件

該事件擴(kuò)展自標(biāo)簽頁(yè)(tabs),下面是為 Ribbon 添加的事件。

名稱 參數(shù) 描述
onClick name,target 當(dāng)單擊按鈕時(shí)觸發(fā)。參數(shù)包括:
name:按鈕的名稱。
target:被點(diǎn)擊的 dom 元素。

方法

該方法擴(kuò)展自標(biāo)簽頁(yè)(tabs),下面是為 Ribbon 添加的方法。

名稱 參數(shù) 描述
loadData data 下載 Ribbon 數(shù)據(jù)。

下載 jQuery EasyUI 實(shí)例

jquery-easyui-ribbon.zip


jQuery EasyUI 擴(kuò)展 jQuery EasyUI 擴(kuò)展
以上內(nèi)容是否對(duì)您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號(hào)
微信公眾號(hào)

編程獅公眾號(hào)