jQuery 3.0時代のコーディングお作法 / 廃止メソッド編

このエントリーをはてなブックマークに追加

jQuery 3.0時代のコーディングお作法 /  廃止メソッド編

本エントリーは「to-R JavaScript Advent Calendar 2015」2日目のエントリー、現在α版が公開されているjQuery 3.0時代のコーディングお作法について解説を行います。

あくまでα版を元にした情報になるので注意してください。

前回はブラウザサポートやshow()/hide()の扱いに関して解説しましたが、今回はjQuery 3.0で廃止されるメソッドと廃止されたメソッドはjQuery 3.0ではどのように記述すれば動作するかについて解説を行います。

廃止されるメソッド一覧

jQuery 3.0で廃止が予定されているメソッドは以下のメソッドです。

これらは廃止されてしまいますが、かなり昔から非推奨がアナウンスされていたメソッドで拙著「Web制作の現場で使うjQueryデザイン入門」でも2013年3月の改訂のタイミングでこれらのメソッドを利用したサンプルを変更しておりますので、利用している人は少ないのでないかと思います。

.success()

Ajax通信成功時の処理を設定できる.success()が廃止されます。

$.ajax({
	url:"bar.json",
}).success(function(){
	//do something
});

同名のコールバックは存在しますので以下のように書き換える事ができます。

$.ajax({
	url:"bar.json",
	success : function(){
		//do something
	}
});

また、同様の処理を行う.done()を利用して以下のように書き換える事もできます。

$.ajax({
	url:"bar.json",
}).done(function(){
	//do something
});

.error()

Ajax通信失敗時の処理を設定できる.error()が廃止されます。

$.ajax({
	url:"bar.json",
}).error(function(){
	//do something
});

同名のコールバックは存在しますので以下のように書き換える事ができます。

$.ajax({
	url:"bar.json",
	error : function(){
		//do something
	}
});

また、同様の処理を行う.fail()を利用して以下のように書き換える事もできます。

$.ajax({
	url:"bar.json",
}).fail(function(){
	//do something
});

.complete()

Ajax通信終了時(成功でも失敗でも)の処理を設定できる.complete()が廃止されます。

$.ajax({
	url:"bar.json",
}).complete(function(){
	//do something
});

同名のコールバックは存在しますので以下のように書き換える事ができます。

$.ajax({
	url:"bar.json",
	complete : function(){
		//do something
	}
});

また、同様の処理を行う.always()を利用して以下のように書き換える事もできます。

$.ajax({
	url:"bar.json",
}).always(function(){
	//do something
});

.load()

ページや画像の読み込みが終了した際の処理を設定できる.load()が廃止されます。

$(window).load(function(){
	//do something
});

これは.on()に書き換えることで利用可能です。

$(window).on("load",function(){
	//do something
});

.unload()

ページから離脱する前の処理を設定できる.unload()が廃止されます。

$(window).unload(function(){
	//do something
});

これは.on()に書き換えることで利用可能です。

$(window).on("unload",function(){
	//do something
});

.error()

画像などの読み込みが失敗した場合の処理を設定できる.error()が廃止されます。

$("img").error(function(){
	//do something
});

これは.on()に書き換えることで利用可能です。

$("img").on("error",function(){
	//do something
});

関連エントリー

jQuery基礎文法最速マスター
jQueryのtrigger()で名前空間を使う
jQueryのoff()を使いこなす
jQueryのclassセレクタに要素名を付ける
Re:jquery 1.xと2.x の違い、さらに動作を音速にするための設定

スポンサードリンク

«jQuery 3.0時代のコーディングお作法 / show()/hide()編 | メイン | jQuery 3.0時代のコーディングお作法 / unwrap()編»

このエントリーのトラックバックURL
コメントを投稿