toolbar 上に表示されるボタン。これは、描画が異なることを除き、通常の button と同等です。一般的には、この要素は画像を持ちます。
詳しい情報が XUL チュートリアルにあります。
関連性のあるアクセシビリティ・ガイドライン
|
- 属性
- accesskey, autocheck, checkState, checked, command, crop, dir, disabled, dlgtype, group, image, label, oncommand, open, orient, tabindex, type, validate
- プロパティ
- accessKey, accessibleType, autoCheck, checkState, checked, command, crop, dir, disabled, dlgType, group, image, label, open, orient, tabIndex, type
例
<toolbar id="test-toolbar">
<toolbarbutton accesskey="P" label="Plain"/>
<toolbarbutton accesskey="C" label="Checkbox" type="checkbox"/>
<toolbarbutton accesskey="b" label="Menu-button" type="menu-button">
<menupopup>
<menuitem label="Menu item 1"/>
<menuitem label="Menu item 2"/>
</menupopup>
</toolbarbutton>
<toolbarbutton accesskey="M" label="Menu" type="menu">
<menupopup>
<menuitem label="Menu item 1"/>
<menuitem label="Menu item 2"/>
</menupopup>
</toolbarbutton>
</toolbar>
<toolbar id="radio-toolbar">
<toolbarbutton accesskey="1" label="Radio 1" type="radio" group="RadioGroup"/>
<toolbarbutton accesskey="2" label="Radio 2" type="radio" group="RadioGroup"/>
<toolbarbutton accesskey="3" label="Radio 3" type="radio" group="RadioGroup"/>
</toolbar>
属性
-
autoCheck - 型: 論理型
- この属性が
trueに設定されているか、この属性が無いとき、button が押下される度にボタンのチェック状態が切り替わります。falseのときは、チェック状態を手動で調整しなければなりません。この属性が true の場合、button の種類は "checkbox" または "radio" でなければなりません。
-
checkState - 型: 整数型, 値は
0または1,2 - この属性は、0 および 1, 2 の button の 3 つの状態を作成するために使用します。状態が 0 または 1 の場合、button を押すと反対の状態に切り替わります。状態が 2 の場合、button を押すと状態 0 に切り替わります。これは、チェック状態を手動で調整するための 3 番目の状態を除き、checkbox のように動作する button を意味します。異なる方法で状態を調整したいときは、
autoCheck属性をfalseに設定し、状態をスクリプトで調整してください。チェック状態を持つ button はtype属性がcheckboxに設定されていなければなりません。この属性に設定可能な定数は nsIDOMXULButtonElement インタフェース内にあります。
- {{ XULAttr("checked") }}
- 型: 論理型
- 要素にチェックが入っているかどうかを示します。
- この属性が設定されているかどうかを確認するには、
getAttribute()ではなくhasAttribute()を使用してください。
button 要素で、この属性による効果を得るには {{ XULAttr("type") }} 属性に checkbox か radio を設定しなければなりません。
-
crop - 型: 下記の値のいずれか一つ
- 要素の label に与えられた空間が小さ過ぎるときは、
crop属性によって指定された側のテキストが切り取られます。テキストが切り取られた場所には省略記号 (ellipsis)が使用されます。ボックスの方向が反対の場合は、切り取られる場所も反対側になります。
start: テキストは先頭から切り取られます。end: テキストは末尾から切り取られます。left: テキストは左側から切り取られます。right: テキストは右側から切り取られます。center: テキストの中央が切り取られ、通常、テキストの先頭と末尾が表示されます。none: テキストは省略記号を使用して切り取られません。しかし、テキストがあまりに長い場合は単純に削除されます。削除する側は CSS の行揃え (text alignment)に依存します。
- {{ XULAttr("dir") }}
- 型: 下記の値のいずれか一つ
- 要素の子要素が配置される方向。
normal: 要素は左から右へ、または上から下へ、XUL コード内に現れる順に配置されます。reverse: 要素は右から左へ、または下から上へ、XUL コード内に現れる順と逆に配置されます。
-
disabled - 型: 論理型
-
要素が無効化されているかどうかを示します。ある要素が
trueに設定されていたら、その要素は無効化されています。無効化された要素は通常グレイ表示のテキストで描画されます。要素が無効化されていると、ユーザのアクションには応答せず、フォーカスもあてられず、commandイベントも発生しません。
-
dlgtype - 型: 下記の値のいずれか一つ
- button がダイアログボックス内にある場合のみ使用される、button の dialog 形式。この機能は、標準のダイアログボックスボタンをカスタムボタンで置き換えるために使用します。dialog イベントメソッドはそのまま機能します。例えば、
dlgTypeがacceptに設定されているときは、この button がダイアログボックスの (普通はOKラベルが付いた) 同意ボタンと置き換えられます。この属性をダイアログボックス内ではない button に使用しても効果はありません。ダイアログの形式として次の値を使用することができます:
accept: OK ボタン。押下された場合、変更に同意します。cancel: キャンセルボタン。操作を中止します。help: ヘルプボタン。ダイアログについてのヘルプを表示します。disclosure: 詳細を表示するボタン。これは、ボタンか詳細表示の三角形になります。
group- 型: グループ名の文字列
- group 属性に同じ値を持つ、type="radio" のボタンは同じグループ内に置かれます。各グループでは一度に一つのボタンのみにチェックを入れることができます。ユーザが一つのボタンを選択すると、グループ内の他のボタンのチェックが外れます。
-
label - 型: 文字列型
- 要素上に表示するlabel。 省略された場合、テキストは表示されない。
-
oncommand - 型: スクリプトコード
- このイベントハンドラは command が活性化した時、呼び出されます。これは、ユーザがメニュー項目を選択したり command に割り当てられたキーボードショートカットが押したりした場合に起こります。
-
orient - 型: 下記の要素のいずれか一つ
- ある要素の子要素の並びが水平方向なのか、垂直方向なのかを指定するのに使われる。デフォルト値はその要素に依存する。-moz-box-orient スタイルプロパティを使用することもできます。
horizontal: ある要素の子要素それぞれが、XUL のソース中で現れる順に、水平に一行に並んでいる。vertical: ある要素の子要素それぞれが、XUL のソース中で現れる順に、垂直に一列に並んでいる。
-
tabindex - 型: 整数型
- 要素のタブの順番。タブの順番は
tabキーが押下されたときにフォーカスが移動する順番です。より大きなtabindexの値をもつ要素は、タブの遷移が後になります。
-
validate - 型: 下記の値のいずれか一つ
- この属性は、キャッシュから image を読み込むかどうかを指示します。image がリモートに格納されるときや、image を頻繁に差し替えようとしているとき、役立つでしょう。次の値はデフォルトで扱われる属性全体を許可、または除外します:
always: image を読み込むべきかどうか、常に確認されます。never: 可能であれば、キャッシュから image が読み込まれます。
プロパティ
-
accessibleType - 型: 整数型
- 要素の accessibility オブジェクトの種類を示す値。
-
checkState - 型: 整数型, 値は
0または1,2 -
checkState属性の値の取得と設定。
メソッド
XUL 要素からの継承
blur, click, doCommand, focus, getElementsByAttribute, getElementsByAttributeNS
DOM 要素からの継承
addEventListener(), appendChild(), compareDocumentPosition, dispatchEvent(), getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getElementsByTagName(), getElementsByTagNameNS(), getFeature, getUserData, hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isEqualNode, isSameNode, isSupported(), lookupNamespaceURI, lookupPrefix, normalize(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS(), setUserData