平成21年2月10日火曜日

JQuery イベント編

今日復習のイベント内容

$('document').ready();
$().ready();
$(function(){});
$().bind('click',function(){});
$().click(function(){});
$(this) DOM対象
$().removeClass();
$().addClass();
.toggle(function(){});
.hover(function(){});
.toggleClass(function(){});
JQuery Eventの転送
HTMLデフォルトイベント
Bindのイベント関数を消す
ユーザーの模擬操作

$('document').ready();
$().ready();
$(function(){});
この三つの効能が同じです
BrowserはページのDOM要素をダウンロード完了の時、触発する

$().bind('click',function(){});
$().click(function(){});
clickなどイベントに処理関数を追加します
APIに全部の常用イベントの説明があります

$(this)
イベント処理関数中に、$(this)というDOM対象はこのイベントをbindされた対象

.toggle(function(){});
.hover(function(){});
.toggleClass(function(){});

JQuery Eventの転送
裏から表面まで転送します
解決方法:
①$().click(function(event){});
event.targetはこのevent最初トリガーのDOM対象
②event.stopPropagation();
イベントの転送はここまで止まります

HTMLデフォルトイベントとさっき討論しているJQueryのイベントが違います
例えば:sumitのイベント
event.stopPropagationでこのイベントを止められない。
この時に.preventDefaultという関数を使います。

HTMLデフォルトイベントとJQueryイベント両方止めたい時は、イベントbindの関数に
falseをretrunする

Bindのイベント関数を消す
.unbind('click',関数名)
関数名がないとき、この対象の全部Clickイベントを消します。
関数名があるとき、この関数のみ消します


ユーザーの模擬操作
.trigger('click')
.click()
この二つ関数は同じ意味、とユーザーのクリック操作と同じ、でも、JQueryこういう機能でクリック操作をしたら、イベントの転送がない、一番したの要素だけイベント関数を実行します。

0 件のコメント: