divによる要素
(名前空間がcontent)
(名前空間がcontent)
pによる要素
(名前空間がsquare)
(名前空間がcontent)
pによる要素
(名前空間がsquare)
<p> <button id="trigger-click">すべてのclickを実行</button> <button id="trigger-content">contentのイベント処理</button> <button id="trigger-square">squareのイベント処理</button> <button id="trigger-reset">元に戻す</button> </p> <div class="square">divによる要素(content)</div> <p class="square">pによる要素(square)</p> <span id="description">名前空間でまとめられた要素に対して一括してイベント処理を実行出来ます。(content)</span>
//イベント処理の登録(名前空間content) $('div.square').bind('click.content',function(ev) { $(this).hide(); } ); //イベント処理の登録(名前空間content) $('span').bind('click.content',function(ev) { $(this).hide(); } ); //イベント処理の登録(名前空間square) $('p.square').bind('click.square',function(ev) { $(this).hide(); } ); //「すべてのclickを実行」がクリックされたら $('button#trigger-click').click(function(ev) { $('body :not(button)').trigger('click'); //イベント処理の実行(clickはすべて) } ); //「contentのイベント処理」がクリックされたら $('button#trigger-content').click(function(ev) { $('body *').trigger('click.content'); } ); //「squareのイベント処理」がクリックされたら $('button#trigger-square').click(function(ev) { $('body *').trigger('click.square'); } ); //「元に戻す」がクリックされたら $('button#trigger-reset').click(function(ev) { $('body *').show(); //すべての要素を表示しなおす } );