0

これが私の問題です。ユーザーが「検証」ボタンをクリックすると、「問題のある」要素の配列を返す AJAX 要求を送信します。その配列から、強調表示したい要素の ID を計算し、それらを「フラッシュ」します。

これはいいですね、うまくいきますが、それらはすべて一緒に点滅します。

それらを次々とフラッシュして、より長く、より見栄えがするようにします(=攻撃的ではありません)。私はqueue()関数を使用しようとしてしばらく時間を費やしましたが(それが行くべき道だと思います)、うまく機能させることができませんでした。

これを行う方法はありますか?

/* this is the function to retrieve bg color (= not the actual subject) */
jQuery.fn.getBg = function() {
    return $(this).parents().filter(function() {
        var color = $(this).css('background-color');
        return color != 'transparent' && color != 'rgba(0, 0, 0, 0)';
    }).eq(0).css('background-color');
};

/* this is my flash function (= not the actual subject) */
function flash(id, font_color, bg_color, nb) {
    var bc=$(id).getBg();
    var cl=$(id).css('color');
    var mx=parseInt(nb);
    if (mx<=0) {
        mx=1;
    }
    for (var i=0; i<mx; i++) {
        $(id).animate({
            backgroundColor: bg_color,
            color: font_color
        }, 200)
        .animate({
            backgroundColor: bc,
            color: cl
        });
    };
}

function localOnAjaxError(dataMessage)
{
  var msg='';
  $('#wait').hide('slow');
  /* show the form again and highlight errors */
  $('#s-inscrire-form').show('slow', function() {
    if (msg!='') {
      $('#erreur').fadeIn('slow');
      flash('#erreur', "#f9e4c9", "#aa0000", 3);
    }
    if (dataMessage instanceof Array) {
      for (key in dataMessage) {
        var m=dataMessage[key];
        if(m.indexOf('#error')==0) {
          /* show the id... */
          $(m).fadeIn('slow', function() {
            /* ...then flash the corresponding label */
            flash('#label-'+this.id.substr(7), "#ffffff", "#aa0000", 3);
          });
        }
      }
    }
  });
  seConnecterAssigneClicksConnexion();
}
4

3 に答える 3

0
于 2012-05-24T16:11:20.983 に答える
0

関数からアニメーション キューを返す必要がありますflash。次に、すべてのフラッシュを for ループで一緒に開始する代わりに (ところで、for-in-loop は配列には適していません)、それらをそのキューに再帰的にプッシュする必要があります。何を試しました.queue()か?

于 2012-05-24T16:04:26.260 に答える
0

実用的なソリューションは次のとおりです。

dataMessage = new Array("#erreur-nomprenom", "#erreur-adresse1", "#erreur-cp", "#erreur-ville", "#erreur-tel");
var theQueue = $({});
for (key in dataMessage) {
    var m = dataMessage[key];
    if (m.indexOf('#erreur') == 0) {
        var toFlash = (function(m) {
            return function(next) {
                $(m).fadeIn('slow', function() {
                    flash('#label-' + this.id.substr(7), "#ffffff", "#aa0000", 3);
                    next();
                });
            }
        })(m);
        theQueue.queue('flash', toFlash);
    }
}
theQueue.dequeue('flash');
于 2012-06-04T19:03:36.130 に答える