自前でデザインしたポップアップ確認画面の表示処理を、Promiseで実装しようとしています。
html
1<div id="confirm" style="display:none;"> 2 <div class="message"></div> 3 <div class="decide">OK</div> 4 <div class="cancel">キャンセル</div> 5</div>
javascript
1var confirm_res = null; 2var confirm_rej = null; 3$("#confirm .decide").click(function(){ 4 $("#confirm").hide(); 5 confirm_res(); 6}); 7$("#confirm .cancel").click(function(){ 8 $("#confirm").hide(); 9 //confirm_rej(); 10}); 11var confirm = function(html){ 12 $("#confirm").show().find(".message").html(html); 13 return new Promise(function(res,rej){ 14 confirm_res = res; 15 confirm_rej = rej; 16 }); 17};
以上が基本コードで、利用時には
javascript
1confirm("削除してよろしいですか?").then(function(){ 2 // 削除処理 3});
のようにしています。
これでひとまず動作するのは確認できたのですが、confirmで生成したPromiseオブジェクトは、ユーザがcancelをクリックしたらresolveもrejectもされずに
ほったらかしになってるのが気になります。
rejectしておきたいのですが、コメントアウトしているconfirm_rejを呼び出したら、
error
1(index):1 Uncaught (in promise)
とエラーが出てしまいます。このエラーを出さなくするためにはcatchを書けばいいみたいなことはわかりましたが、下手に書くとエラーが増えたり、キャンセルしたのにthen以下が実行されたりしてしまいます。
catchはどこにどう書けば適切に動いてくれるのでしょうか?
---- 追記 ---
javascript
1confirm("削除してよろしいですか?").then(function(){ 2 // 削除処理 3}).catch(function(e){});
呼び出し時にこうすればいいのはわかってますが、できればconfirm定義付近にcatchを書いておいて、呼び出し時には書かなくていいようにしたいのです。