c# - アニメーション エクステンダーの問題

Answer 1

表示されているフローは次のようなものです。

1. ボタンをクリック
2. AnimationExtender はアクションをキャッチし、clickOn コールバックを呼び出します
3. linkPostback はページの非同期リクエストを開始し、フローを AnimationExtender に返します
4. アニメーション開始
5. pageRequest が戻り、playAnimation を呼び出します。これにより、アニメーションが再び開始されます。

この問題を回避するには、少なくとも 2 つの方法があると思います。必要な JavaScript はほぼすべて揃っているようですが、クリックでアニメーションを開始する AnimationExtender を回避するだけで済みます。

オプション 1: AnimationExtender ボタンを非表示にして、アニメーションを再生する独自の新しいボタンを追加します。これは、AE ボタンのスタイルを「display: none;」に設定するのと同じくらい簡単です。独自のボタンで linkPostback() を呼び出します。

オプション 2: アニメーションが終了したら、Animation Extender を再度無効にします。playAnimation 呼び出しがブロックされている限り、これは機能するはずです。おそらく次のようになります。

function linkPostback() {

    var prm = Sys.WebForms.PageRequestManager.getInstance();
    prm.add_endRequest(playAnimation)
}

function playAnimation() {

    AnimationExtender.Enabled = true;
    var onclkBehavior = $find("ctl00_btnOpenList").get_OnClickBehavior().get_animation();
    onclkBehavior.play();
    AnimationExtender.Enabled = false;
}

余談ですが、pageRequest の受信が遅れると、一般的なアプローチで問題が発生する可能性があります。ボタンをクリックして数秒後にアニメーションが発生するのは少し奇妙かもしれません。データを事前にロードするか、div に「Loading...」を事前に入力し、適切なサイズにしてから、到着時に実際のコンテンツを入力することをお勧めします。

Answer 2

与えられた答えの助けを借りて、最終的な解決策は次のとおりです。

別のボタンを追加して非表示にします。

<input id="btnHdn" runat="server" type="button" value="button" style="display:none;" />

不要なクリック イベントが発生しないように、AnimationExtender を非表示のボタンにポイントします。

<cc1:AnimationExtender ID="aniExt" runat="server" TargetControlID="btnHdn">

ポストバックの完了後にアニメーションをトリガーするボタンに JavaScript を接続します。

<asp:ImageButton ID="btnShowList" runat="server" OnClick="btnShowList_Click" OnClientClick="linkPostback();" />

必要な Javascript をページに追加します。

function linkPostback() {
        var prm = Sys.WebForms.PageRequestManager.getInstance();
        prm.add_endRequest(playOpenAnimation)
}

function playOpenAnimation() {
    var onclkBehavior = ind("ctl00_aniExt").get_OnClickBehavior().get_animation();
    onclkBehavior.play();         

    var prm = Sys.WebForms.PageRequestManager.getInstance();
    prm.remove_endRequest(playOpenAnimation) 
}