デザイナーにも分かりやすいjQuery入門講座|jQueryの使い方

このエントリーをはてなブックマークに追加
索引
Core:コアとなる仕組み
Selectors:セレクタ
Attributes:属性
Traversing:対象の変更
Manipulation:操作
CSS:スタイルシート
Events:イベント
Effects:演出効果
Ajax:xml等との連携
Utilities:ユーティリティ
Data:データ
Miscellaneous:諸々
Deferred:処理管理
Callbacks:コールバック
Internals:内部処理

deferred.resolve( )deferredオブジェクトの状態を正常終了に移行

構文

deferredオブジェクトの状態を正常終了に移行返値:deferredオブジェクト
deferred.resolve( [引数] )ver1.5〜

機能

deferred.resolveメソッドは、defferdオブジェクトの状態を「正常終了(resolved)」に移行します。その結果deferred.doneメソッドで設定したfunctionが実行されます。「引数」はdeferred.doneメソッドで設定したfunctionの引数に送りたい値を設定します。

解説

deferredオブジェクトを「正常終了」させる(引数なし)

サンプル(resolve/01.html)を開いてbody内にbutton要素しかないことを確認してください。jQueryでは、まず以下の部分を確認してください。1行目ではdeferredオブジェクト「dfd」を作成し、2〜4行目でdeferred.doneメソッドを利用して、処理が完了した時の処理を設定しています。サンプルではbody要素に「done」と表示するようにしています。

var dfd = $.Deferred();
dfd.done(function(){
	$("body").append("done");
});

続いて以下の部分を確認してください。buttonがクリックされたら、deferred.resolveメソッドを利用してdeferredオブジェクトを正常終了させます。

$("button").click(function(){
	dfd.resolve();
});

そのためbuttonをクリックすると、deferredオブジェクトが正常終了してdoneメソッドで設定した処理が実行されます。結果としてbody要素内に「done」と表示されます。

deferredオブジェクトを「正常終了」させる(引数あり)

deferred.resolveメソッドは引数で情報を送ることができます。サンプル(resolve/02.html)を開いてbody内の構成がresolve/01.htmlと同じ事を確認してください。

jQueryは少し変更されており、以下の様にdeferred.doneメソッドメソッドで設定しているfunctionで引数を受け取るようにしています。引数は変数strで受け取り、3行目の処理でbody内の要素に表示するようにしてます。

var dfd = $.Deferred();
dfd.done(function(str){
	$("body").append(str);
});

次に以下の部分を確認してください。deferred.resolveメソッドの引数に「done!」と設定しました。結果としてbuttonをクリックすると、doneメソッドのfunctionに引数が渡され、body要素内に「done!」と表示されます。

$("button").click(function(){
	dfd.resolve("done!");
});

引数を複数送りたい場合は、カンマで区切って設定します。→参考:サンプル(resolve/02b.html

var dfd = $.Deferred();
dfd.done(function(str1, str2){
	$("body").append(str1 + " " + str2);
});			
$("button").click(function(){
	dfd.resolve("hello", "world");
});

関連項目

引数としてコンテキスト(thisとして利用するobject)を渡したい場合はdeferred.resolveWithメソッドを利用してください。