0

これをどのように処理するか疑問に思います。私は以前にそれを行いましたが、それは多くのif / elseステートメントを含み、それに頼らなければそれを理解することはできないようです。私はそれをcodereviewに投稿し、誰かにそれを再構築するのを手伝ってもらいましたが、今はこの機能を正しく機能させようとしています。

これが現在どのように機能するかは、「上」をクリックするとスコアが1ポイント増加します。もう一度「上」をクリックするとスコアが下がります。それはいいです。「下」をクリックすると、同じ動作になります。ただし、負のスコアを表示したくないので、0を下回ることはありません。

今、私は前のボタンまたは次のボタン.upColorに.downColorcssクラスがあるかどうかを確認しています。これにより、すでに投票されているかどうかが確認されます。特に元のスコアが0の場合、またはスコアが10の場合、これに基づいて適切なスコアを更新しようとして問題が発生します。

私が実装しようとしているロジック：

例：元のスコアは0です：

  • ユーザーが投票します。スコアは1になります。ユーザーは反対票を投じます。スコアは0になります（-1ではありません）
  • ユーザーが反対票を投じます。スコアは0のままです。ユーザーが投票します。スコアは1になります。

例：元のスコアは10です：

  • ユーザーが投票します。スコアは11になります。ユーザーは反対票を投じます。スコアは9になります。
  • ユーザーが反対票を投じます。スコアは9になります。ユーザーが投票します。スコアは11になります。

コード：

$(function() {

var handleClick = function($btn) {
    var $voteContainer = $btn.parent();
    var scoreNode = $('.count');
    var originalScore = Number($voteContainer.data('original-score'));

    if ($btn.hasClass('down')) {
        if ($btn.prevAll('.up').hasClass('upColor')) {
            $btn.prevAll('.up').toggleClass('upColor');
            alert('voted up now voting down, decrease 2 points, but don\'t go below 0.');
        }
    }


    if ($btn.hasClass('up')) {
        if ($btn.nextAll('.down').hasClass('downColor')) {
            $btn.nextAll('.down').toggleClass('downColor');
            alert('voted down now voting up, increase by 2 points');
        }
    }

    var increment = $btn.hasClass('up') ? 1 : $btn.hasClass('down') && originalScore > 0 ? -1 : 0; // default

    // Only do something if there is an increment
    if (increment) {
        var currentScore = Number(scoreNode.text()) || 0;
        var newScore = currentScore + increment;
        var diff = Math.abs(originalScore - newScore);

        // Can't go more than + or - 1
        if (diff > 1) {
            newScore = originalScore;
        }

        // Set new displayed value
        scoreNode.text(newScore);
    }
    $btn.hasClass('up') ? $btn.toggleClass('upColor') : $btn.toggleClass('downColor');
};

var upBtn = $('.up');
var downBtn = $('.down');

upBtn.add(downBtn).click(function() {
    var $btn = $(this);

    handleClick($btn);
});

});

デモ： http： //jsfiddle.net/3kCPw/

4

1 に答える 1

0

時間がかかりすぎるため、コードを書き直すことはしませんが、最初から使用していたであろうコードをいくつか示します。

元の番号から始めます。

var original_vote = 2;
var current_vote = original_vote;

将来のために参照する定数としてこれを保持します。次に、賛成票をクリックすると、次のように単純に 1 を追加できます。

current_vote = original_vote + 1;

次に、賛成票のチェックを外すと、次のようになります。

current_vote = original_vote;

次に、反対の投票を行うだけです。

元の数を維持することで、誤って投票が本来あるべき範囲から外れることを防ぐことができます。

お役に立てれば！

于 2012-11-08T01:30:04.850 に答える