マウス・クリック振る舞い

コンテナー・オブジェクト (フォームなど) のスコープ内で、 アクション、関数、またはその両方に マウス・ボタンをバインドします。 マウス・ボタンをクリックすると、 アクション、関数、またはその両方が呼び出されます。

マウス・クリック振る舞いを使用すると、 コントロール内またはコンテナー・タグ内で マウス・ボタンがクリックされるたびに、 アクションまたは JavaScript™ 関数を 実行させることができます。 バインドのスコープは、 その振る舞いが割り当てられるタグの種類によって異なります。 form、div、body などのコンテナー・タグに、 この振る舞いがバインドされている場合、 コンテナー内でマウスがクリックされるたびに アクション/関数が実行されます。 入力タグのような非コンテナー・タグに、 この振る舞いがバインドされている場合、 コントロール内で発生するクリックに対してのみ、 バインドが適用されます。 コントロール「内」をクリックする、 という行為の解釈については、 使用するブラウザーによって若干異なる場合が あります (例えば、コントロールの マージン/境界線をクリックすることを、 コントロール「内」のクリックと見なすかどうか)。 マウス・クリック振る舞いを使用すると、 コントロール内またはコンテナー・タグ内で マウス・ボタンがクリックされるたびに、 アクションまたは JavaScript 関数を 実行させることができます。 バインドのスコープは、 その振る舞いが割り当てられるタグの種類によって異なります。 form、div、body などのコンテナー・タグに、 この振る舞いがバインドされている場合、 コンテナー内でマウスがクリックされるたびに アクション/関数が実行されます。 入力タグのような非コンテナー・タグに、 この振る舞いがバインドされている場合、 コントロール内で発生するクリックに対してのみ、 バインドが適用されます。 コントロール「内」をクリックする、 という行為の解釈については、 使用するブラウザーによって若干異なる場合が あります (例えば、コントロールの マージン/境界線をクリックすることを、 コントロール「内」のクリックと見なすかどうか)。

ボタンがクリックされると、 関数 (提供されている場合) が実行されます。 アクション (またはアクションのリスト) が提供されている場合は、 次にアクションが実行されます。 関数とアクションの両方が提供されている場合、 その関数が false を戻すことによって、 アクションの実行を妨げることができます。 どちらのケースでも、 クリックの「デフォルトの」振る舞いは、 実行「しない」になっています。 例えば、右マウス・ボタンがバインドされている場合、 そのボタンがクリックされても、 コンテキスト・メニューを表示するという、 ブラウザーのデフォルトの振る舞いは起こりません。

マウスクリック振る舞いを #body に割り当てて、 ボタンには「すべて (ALL)」を指定し、 アクションには「何もしない (NOTHING)」を指定すると、 ページ内でマウスが使用不可になります。

コンポーネントを発行する JSF タグ

<hx:behaviorRightMouse>

基本 HTML

任意の HTML コンテナー・ タグ (<form><div> など)、 またはマウス・イベントを受け入れる 任意の HTML タグ (<input> など)。

複数のマウス・クリックを 1 つのタグに付加することができます。 ページ全体にクリック振る舞いを割り当てる には、#body をタグとして使用します。

JavaScript コンストラクター

hX_5.addBehavior("id", "onmouse", new hX_5.JSFBehaviorMouseclick(attributes)); 各部の意味は次のとおりです。

id

コンポーネントが付加される HTML タグの ID。

属性

コンマで区切られた属性のリスト。 各属性は、属性名と値から成る引用符付きストリングになっており、 コロンで区切られています (例: "label:MyLabel")。

サポートされるイベント

イベント

説明

onmouse

特殊なイベント名の使用には注意してください。 この振る舞いによって、 複数のマウス (およびマウス以外の) イベント・ハンドラーが変更されます。

属性

表 1. マウス・クリック振る舞い

属性名

説明

button

バインドするマウス・ボタン。 ALL は、マウス上のすべてのボタンを意味します。 右マウス・ボタンが存在しない場合があるので (例えば Mac OS 用のマウス)、 注意してください。

action

クリック可能なエンティティーを クリックしたときに実行されるアクション (またはアクションのセット)。 通常は、アクションのターゲット (またはターゲットのセット) が 必要になります。

target

ページ内の「input type='text'」フィールド の ID (このフィールドが提供されている場合)。 メニューで何かが選択されている場合は、 指定されたフィールドの値として、 メニュー項目のテキストが必ず設定されます。 通常、コンボ・ボックスをエミュレートする ポップアップ・メニューを作成する場合にのみ、 この属性が使用されます。 例えば、入力フィールドに隣接するメニューがあり、 メニューの最上位が単一のボタンになっているとします。 このボタンをクリックしてメニューを表示し、 そのメニューから項目を選択して、 入力フィールドの値を設定するような場合には、 この属性を使用してください。

function

キーを押したときに 実行される JavaScript 関数 (また は JavaScript の インライン・ストリング)。

順序付け

イベント用に指定された他のハンドラーのあとに、実行されます。

すべてのアクション/関数が実行されたあとに、 続行中/バブル中のイベントを停止します。

API 呼び出し

表 2. マウス・クリック API 呼び出し

API 呼び出し

説明

object = setAttribute(attribute)

属性を設定します。 属性がすでに設定されたものである場合は、 その値を変更します。

string = getAttribute(attribute-name)

属性の現行値を取得します。

制限

サンプル・コード

ページ内で、マウスを使用不可にします。

hX.addBehavior("#body", "onmouse", new hX.JSFBehaviorMouseclick("scope:all", "action:nothing"));

div 内で、 右マウス・ボタンを使ったコンテキスト・メニューの表示を 使用不可に設定して、 使用不可になっていることをユーザーに伝えます。

hX.addBehavior("form1:div1", "onmouse", new hX.JSFBehaviorMouseclick("scope:right", 
               "action:alert", "target:The context menu is disabled."));

フィードバック