THE HAM MEDIA BLOG

jQueryのbindやtriggerを勉強しようと思い、とりあえず作ってみたサンプルを書いておく。まだ勉強途中。

サンプル

■サンプルHTML

<p><button id="test1">デモ１</button><button id="test2">デモ２</button></p>
<p id="test3">サンプル</p>

■サンプルスクリプト

$('#test1').bind('click',function(e,color,text){
	$('#test3').text(text||"青色になります").css('color',color||'#0000ff');
});
$('#test2').click(function(){
	$('#test1').trigger('click',['#ff0000','赤色になります']);
});

■サンプルデモ

今日はサンプルと、参考サイトとのにらめっこで終わり。もう少し勉強してみます。

デモ１の場合は青色のテキストになって、デモ２の場合は赤色になるサンプル。デモ１はbindを使っていて、デモ２はtriggerを使っている。triggerで指定した値をデモ１のclickイベントに渡すことによって赤色になる仕組みです。デモ１のクリックでは、値がわたってこないので、もともとスクリプトに入れていたテキストと色が表示される。と、今日はここまででおしまい。

引き続き勉強

１日に勉強できる時間が限られるので、しばらくはこの勉強が続く…かもしれない。