###前提・実現したいこと
JavaScript(jQuery)でsubmitボタンを押した時にconfirm()の代わりにcolorboxを使いたいです。
サーバからもらったデータを現在作成したデータと比べ、同じデータがあった場合coloboxを出して確認する流れです。
それぞれのcolorboxがconfirm()のようにボタンを押すまで待つ必要があります。
###発生している問題
ボタンを押した時順番的にcolorboxが出てくるのではなく、すべてが終わった後、colorboxが現れます。
###該当のソースコード
jQuery
1$(function(){ 2 $("#testButton").click(function(){ 3 if(data.a == a){ 4 var chk = confirmBox(data.msg_a); 5 if(chk == false) 6 return false; 7 } 8 if(data.b == b){ 9 var chk2 = confirmBox(data.msg_b); 10 if(chk2 == false) 11 return false; 12 } 13 if(data.c == c){ 14 var chk3 = confirmBox(data.msg_c); 15 if(chk3 == false 16 return false; 17 } 18 return true; 19 } 20}); 21 22function confirmBox(msg) { 23 $.colorbox({ 24 html: 25 + msg + "が同一ですが、続きますか?" + 26 "<li><button type='button' id='okButton'>OK</button></li>" + 27 "<li><button type='button' id='cancel'>戻る</button></li>", 28 padding : 5, 29 width:"300px", 30 height:"400px", 31 opacity: "0.8", 32 speed: 200, 33 closeButton: false, 34 onOpen: function() { 35 $("#colorbox").css({ 36 "opacity": 1 37 }); 38 }, 39 onComplete: function(){ 40 $("#okButton").click(function(){ 41 parent.$.colorbox.close(); 42 return true; 43 } 44 $("#cancel").click(function(){ 45 parent.$.colorbox.close(); 46 return false; 47 } 48 } 49 }); 50 }
###試したこと
setTimeoutを使ってみましたけど駄目でした。
debugモードで確かめてみましたけどcolorboxが現れてボタンを押すのを待たずに進んでてreturn true;で終わった後からcolorboxが出てきました。
confirm()の代わりにcolorboxを使って順番的にボタンを押したら次に進むようにしたいです。
コードを略した時に付けてた答えを試してみましたけど、順番的って事だけ合ってませんので使えなかったです。
答えのソースではonClosedで比べするとなんとか出来るとは思いますが、そうだとデータが合わなくスキップするcolorboxも考える必要があります。でも答えのソースでは一度は必ずcolorboxが現れる必要がありましのであのソースでは使えませんでした。
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2016/04/20 05:08
2016/04/20 05:22 編集
2016/04/20 05:34