-1

divとカウントダウンjavascriptのみを含む小さなphpファイルがあります。コードは次のとおりです。

        <b><div id="COUNTER"></div></b>
        <SCRIPT type="text/javascript">
        var TargetCOUNTER = document.getElementById('COUNTER');
        //HIER DIE SEKUNDEN EINTRAGEN HERR REUTER !!
        var SecondsCOUNTER = 5654;
        //------------------------------------------
        var TargetTimeCOUNTER = new Date();
        var TimeBeginnCOUNTER = TargetTimeCOUNTER.getTime();
        var TimeEndCOUNTER = TimeBeginnCOUNTER + (SecondsCOUNTER*1000);
        TargetTimeCOUNTER.setTime(TimeEndCOUNTER);

        var DayCOUNTER = TargetTimeCOUNTER.getDate();
        var MonthCOUNTER = TargetTimeCOUNTER.getMonth() + 1;
        var YearCOUNTER = TargetTimeCOUNTER.getYear();
        if(YearCOUNTER < 999) YearCOUNTER += 1900;
        var hCOUNTER = TargetTimeCOUNTER.getHours();
        var mCOUNTER = TargetTimeCOUNTER.getMinutes();
        var sCOUNTER = TargetTimeCOUNTER.getSeconds();

        var fdayCOUNTER  = ((DayCOUNTER < 10) ? "0" : "");
        var fmonthCOUNTER  = ((MonthCOUNTER < 10) ? ".0" : ".");
        var fhCOUNTER  = ((hCOUNTER < 10) ? "0" : "");
        var fmCOUNTER  = ((mCOUNTER < 10) ? ":0" : ":");
        var fsCOUNTER  = ((sCOUNTER < 10) ? ":0" : ":");

        var EndDateCOUNTER = fdayCOUNTER + DayCOUNTER + fmonthCOUNTER + MonthCOUNTER  + "." + YearCOUNTER;
        var EndTimeCOUNTER = fhCOUNTER+hCOUNTER+fmCOUNTER+mCOUNTER+fsCOUNTER+sCOUNTER;

        CountDownCOUNTER();
        function CountDownCOUNTER() {
            var CurrentDateCOUNTER = new Date();
            var CurrentTimeCOUNTER = CurrentDateCOUNTER.getTime()
            var OpenTimeCOUNTER = Math.floor((TargetTimeCOUNTER-     CurrentTimeCOUNTER)/1000);

            var sCOUNTER = OpenTimeCOUNTER % 60;
            var mCOUNTER = ((OpenTimeCOUNTER-sCOUNTER)/60) % 60;
            var hCOUNTER = ((OpenTimeCOUNTER-sCOUNTER-mCOUNTER*60)/(60*60));
            var fhCOUNTER  = ((hCOUNTER < 10) ? "0" : "");
            var fmCOUNTER  = ((mCOUNTER < 10) ? ":0" : ":");
            var fsCOUNTER  = ((sCOUNTER < 10) ? ":0" : ":");

            var TimeCOUNTER = fhCOUNTER+hCOUNTER+fmCOUNTER+mCOUNTER+fsCOUNTER+sCOUNTER;
            var OutputStringCOUNTER=TimeCOUNTER;

            if(OpenTimeCOUNTER<=0) { // Event wenn der Countdown abgelaufen ist
                OutputStringCOUNTER="<a href='../hackerz/fight.php' style='text-decoration: none; color: #00ff00'>Aktualisieren</a>";
            }

            TargetCOUNTER.innerHTML=OutputStringCOUNTER; // Ausgabe des Strings in der Betreffenden Zelle
            document.title=(OutputStringCOUNTER.substring(0,2)=="<a")?"!!!READY!!!":OutputStringCOUNTER;
            window.setTimeout("CountDownCOUNTER()",1000);
        }
    </SCRIPT>

それは非常にうまく機能します。あなたはここでそれをチェックすることができます：http：//dev.willstequatschen.de/hw/sites/hackerz/counter.php

しかし、異なるカウンターで2行を表示したいのですが、コードをコピーして貼り付けると、2番目のカウンターが表示されません。何故ですか？

4

4 に答える 4

2

カウンターコンテナのIDを受け入れる単一の関数ですべてのコードをラップします。

function setCounter(id) {
    var TargetCOUNTER = document.getElementById(id);
    // rest of your code here
}

カウンターごとにこの関数を個別に呼び出します。

setCounter('COUNTER1');
setCounter('COUNTER2');

デモを参照http://jsfiddle.net/dfsq/CdeGs/

于 2012-10-26T12:16:53.157 に答える
0

コードをコピーして貼り付けるだけで、両方のコピーが機能します<div id="COUNTER"></div>（つまり、カウンターは1つだけになります）。

2つのカウンターdivを持つようにコードを変更し、CountDownCOUNTER関数にパラメーターとして取得させるか、両方を更新させる必要があります。

于 2012-10-26T12:14:19.160 に答える
0

コピーのIDを「COUNTER」から別の一意のIDに変更する必要がある可能性があります。元のタグとJSの「GetElementbyID」の先頭の両方で変更する必要があります。

実際、コードの外観に基づいて、変数と関数名との衝突を防ぐために、「COUNTER」から「ALTCOUNTER」などの2番目のコピー全体に対してグローバルな検索と置換を実行するのが最善の場合があります。

于 2012-10-26T12:14:22.947 に答える
0

コードは実際にはオブジェクト指向ではなく、再利用性を念頭に置いて記述されているわけではないため、この方法で使用できるインスタンスは1つだけです。

推奨される方法は、たとえば「プラグイン」など、より抽象的でコンポーネントスタイルの方法でコードを書き直すことです。

たぶん、コードを削除して、既成のソリューションを使用する必要があります。

あなたができる汚いアプローチは、個々のiframeにカウンターをロードすることです-それはスコープの衝突の問題を解決しますが、私はそれを本当にお勧めしません。

于 2012-10-26T12:17:19.783 に答える