http://www.atmarkit.co.jp/fdotnet/jqueryref/02attribute/attribute_14.html
要素の高さを取得するのは
height()、width()
innerHeight()、innerWidth()
outerHeight()、outerWidth()
outerHeight( true )、outerWidth( true )
があります。便利ですね。
それぞれ
・なにも含まない
・padding を含む
・border-width を含む
・margin を含む
となっていました。
参考
http://semooh.jp/jquery/cont/doc/event/
eventオブジェクト.preventDefault()でブラウザの初期アクションをキャンセルできるそうです。
前述のreturn falseの方がお手軽な気がします。
使いどころだと思います。
$("#test a").click(function (e) {
e.preventDefault();
}
http://blog.macaroniworks.net/2010/03/jquery-aのイベントでリンクさせない処理/
$('#foo').slideUp(300).delay(800).fadeIn(400);
使いそうなのでメモっておきます。
直感的で簡単なので、すぐに導入できそうです。
DesignReviver
http://designreviver.com/wp-content/uploads/2008/10/example.html
に下記の記述があったのですが、なにかよくわかりませんでした。
$("ul",this)
これは$(this)の中のul要素を選択する時などに使うと思われますが、
初めて見てしまいました。
知らないとはおっかないね。
前々からやってはいましたが、データの形式(配列からJSONに)とコールバックの仕方を変えてシンプルにしたので一応メモっておきます。
もちろんこれだけでは動かず一定間隔ごとにchange()関数を実行する必要があります。
ちなみにJSONは(JavaScript Object Notation)だそうです。
//初期フェーズ
slide_phase=-1;
//データ
pickup_data=new Array();
slide_data[0]={"href":"test_url1.html","comment":"テスト1","img_path":"1.jpg"};
slide_data[1]={"href":"test_url2.html","comment":"テスト2","img_path":"2.jpg"};
slide_data[2]={"href":"test_url3.html","comment":"テスト3","img_path":"3.jpg"};
slide_num=slide_data.length;
function change(){
if(slide_phase < slide_num-1){
slide_phase ++;
}else{
slide_phase =0;
}
$("#slide img").fadeOut(500,changeSrc);
$("#slide a").attr("href",slide_data[slide_phase].href);
$("#slide .comment").text(slide_data[slide_phase].comment);
}
//コールバック
// $(this)でイベントが発生したオブジェクトを受け取れる。
function changeSrc(){
$(this).attr("src", slide_data[slide_phase].img_path).fadeIn(2500);
}
これ知りませんでした。
用済みになると、普通にunbind()していました。
$(function(){
$("a").one("click",function(){
alert("もう出てきませんよ。");
})
})
aにclickなどのイベント処理をする場合、hrefのリンク先に飛んでしまうので
困っていました。
例えば、下の処理です。
$(function(){
$("a").click(function(){
$("#test_img").attr("src","test.jpg");
})
})
このような時は関数の返り値をfalseにしてやることで
aがリンクするのを回避する事が出来るそうです。
$(function(){
$("a").click(function(){
$("#test_img").attr("src","test.jpg");
return false;
})
})
これ、もっと早く知っておきたかったです。
これもやってることは同じだと思います。
$("div:eq(2)").addClass("test");
$("div").eq(2).addClass("test");
場面によって使い分ける形で。
セレクタだったか、関数だったかとこんがらがってました。
両方ありました。
$(“#test:eq(2)”)で
$(“#test:eq[2]“)ではない
length()とsize()はおそらく同じだと思いますが
lengthはArrayのプロパティと一見見間違えそうですので
自分はsize()を利用する事にします。
また変更するかもですが・・・
こんなかんじでした。
html
js
$("#viewer_link a").click(function(){
alert($("#viewer_link a").index(this));
});
この
index(this)
っていうのがくせ者で、なかなか思いつきませんでした。
メモってたくせに。
過去のエントリー
jQuery エレメントのインデックス番号を返す
http://blog.macaroniworks.net/2009/11/jquery-エレメントのインデックス番号を返す/