jQuery EasyUI メニューとボタンプラグイン -Splitbutton 分割ボタン

jQuery EasyUI 插件jQuery EasyUI プラグイン

$.fn.linkbutton.defaults から拡張されています。$.fn.splitbutton.defaults を使用してデフォルトの defaults を上書きします。

メニューボタン（menubutton）と同様に、分割ボタン（splitbutton）もリンクボタン（linkbutton）およびメニュー（menu）に関連しています。メニューボタン（menubutton）とは異なり、分割ボタン（splitbutton）は2つの部分に分割されています。マウスを分割ボタン（splitbutton）の上に移動すると、分割線が表示されます。マウスが分割ボタンの右側部分にある場合にのみメニュー（menu）が表示されます。

依存関係

  • menubutton

使用方法

マークアップから分割ボタン（splitbutton）を作成します。

<a href="#" id="sb" class="easyui-splitbutton"
    data-options="menu:'#mm',iconCls:'icon-ok'" onclick="javascript:alert('ok')">Ok</a>
<div id="mm" style="width:100px;">
    <div data-options="iconCls:'icon-ok'">Ok</div>
    <div data-options="iconCls:'icon-cancel'">Cancel</div>
</div>

JavaScript を使用して分割ボタン（splitbutton）を作成します。

<a href="#" id="sb" onclick="javascript:alert('ok')">Ok</a>
<div id="mm" style="width:100px;">
...
</div>

$('#sb').splitbutton({
    iconCls: 'icon-ok',
    menu: '#mm'
});

プロパティ

このプロパティはリンクボタン（linkbutton）から拡張されています。以下は分割ボタン（splitbutton）で追加されたプロパティです。

名前 型 説明 デフォルト値
plain boolean true に設定すると、シンプルなエフェクトが表示されます。 true
menu string 対応するメニュー（menu）を作成するためのセレクタです。 null
duration number ボタンにカーソルを合わせたときに、メニュー（menu）を表示する時間をミリ秒単位で定義します。 100

メソッド

このメソッドはリンクボタン（linkbutton）から継承されています。以下は分割ボタン（splitbutton）で追加または上書きされたメソッドです。

名前 パラメータ 説明
options none オプション（options）オブジェクトを返します。
disable none 分割ボタン（splitbutton）を無効にします。コード例：
$('#sb').splitbutton('disable');
enable none 分割ボタン（splitbutton）を有効にします。コード例：
$('#sb').splitbutton('enable');
destroy none 分割ボタン（splitbutton）を破棄します。
jQuery EasyUI 插件jQuery EasyUI プラグイン その他の拡張機能