0

コンテキスト: 私の製品 Web サイトには、Java Webstart アプリケーションへのリンクがあります (いくつかの場所にあります)。

私の目標: ユーザーがダブルクリックできないようにします。つまり、最初のクリックでのみ「起動」し、3 秒待ってからリンクを再度有効にします。クリックすると、リンク画像を、アプリケーションが起動中であることを示すものに変更します。

クリック後に画像が確実に更新されないことを除いて、私のソリューションは機能します。コメントアウトされたデバッグ出力により、適切なコンテンツが得られ、マウスオーバー コールバックも正しく機能します。

http://www.auctober.de/beta/ (ボタン "jetzt starten" をクリックしてください) で実行されていることを確認してください。

ところで：そのダミーアニメーションよりも遅延のある関数を呼び出すより良い方法がある場合は、私に知らせてください。

JavaScript:

<script type="text/javascript">
      <!--
        allowClick = true;
        linkElements = "a[href='http://www.auctober.de/beta/?startjnlp=true&rand=1249026819']";
        $(document).ready(function() {
            $('#jnlpLink').mouseover(function() {
                if ( allowClick ) {
                    setImage('images/jetzt_starten2.gif');
                }
            });
            $('#jnlpLink').mouseout(function() {
                if ( allowClick ) {
                    setImage('images/jetzt_starten.gif');
                }
            });

           $(linkElements).click(function(evt) {
                if ( ! allowClick ) {
                    evt.preventDefault();
                }
                else {
                    setAllowClick(false);
                    var altContent = $('#jnlpLink').attr('altContent');
                    var oldContent = $('#launchImg').attr('src');
                    setImage(altContent);
                    $(this).animate({opacity: 1.0}, 3000, "", function() {
                        setAllowClick(true);
                        setImage(oldContent);
                    });
                }
            });

        });

        function setAllowClick(flag) {
            allowClick = flag;
        }
        function setImage(imgSrc) {
            //$('#debug').html("img:"+imgSrc);
            $('#launchImg').attr('src', imgSrc);
        }
      //-->
</script>
4

4 に答える 4

1

setTimeout 関数を使用して遅延を実現できます

setTimeout(function() { alert('something')}, 3000);//3 secs

src の問題については、次を試してください。

$('#launchImg')[0].src = imgSrc;
于 2009-07-31T08:13:48.160 に答える
0

...または単に使用：

$(this).animate({opacity: '1'}, 1000);

$(this) は、すでに opacity=1 になっているコードのどこにでもあります...これは、一見すべてが 1 秒間一時停止しているように見えることを意味します。私はいつもこれを使っています。

于 2010-01-11T21:15:06.107 に答える
0

BlockUIプラグインをチェックしてください。それはあなたが探しているものかもしれません。

ここで素敵なデモを見つけることができます。

于 2009-07-31T08:12:44.263 に答える
-2

この変数をスクリプトの先頭に追加します。

var timer;

この関数を実装します。

function setFlagAndImage(flag) {
    setAllowClick(flag);
    setImage();
}

次に、ダミー アニメーションを次のように置き換えます。

timer = window.setTimeout(function() { setFlagAndImage(true); }, 3000);

何か他のことが起こってタイマーを止めたい場合は、次のように呼び出すことができます:

window.clearTimeout(timer);
于 2009-07-31T08:22:31.687 に答える