jqueryカウンタ/ uncounter関数

私はユーザーが星をクリックすることができ、カウンターが増加し、Unlikeという言葉が現れる機能について取り組んでいます。次に、ユーザーが「反対」をクリックすると、カウンターが減少し、「違う」という言葉が消えます。これまでのところ、それは動作します。

難しいのは、各ユーザーが一度だけクリックできるようにする(現在は動作している)ようにしたいが、別のユーザーが既に「別のフレーズ」をクリックしている場合は、再度スターをクリックできるようにしたいカウンターから数字を削除したでしょう)。 (下のコードとjsfiddle)。

HTML

Star  
· Unlike

jQuery

$(function(){
    $('.unstar').hide();
    var count1=0;

    $('.star').one("click", function() { 
        count1++;
    $('.unstar').show();

    $('.star_number').html(count1);
    });

    $('.unstar').one("click", function() { 
        count1--;
    $('.unstar').hide();

    $('.star_number').html(count1);
    });

 });    

Also, here's the JS fiddle - http://jsfiddle.net/j5qAs/

1

3 答え

私は以下のトリックを行う必要がありますと思う、私はあなたの質問を正しく理解した場合、

I used :visible instead of count because I assumed that the count will be returned from server and it may not be 1 or 0.. it will be > 1.

DEMO here

$(function(){
    $('.unstar').hide();
    var count1=0;

    $('.star').bind("click", function() {       //<-- changed to bind
        if ($('.unstar').is(':visible')) return;//<-- added
        count1++;
        $('.unstar').show();

        $('.star_number').html(count1);
    });

    $('.unstar').bind("click", function() {    //<-- changed to bind
        count1--;
        $('.unstar').hide();

        $('.star_number').html(count1);
    });

 });    
1
追加された
ご回答有難うございます;別のユーザーが数分前に同じ回答を投稿しました。私はこれを投票した。
追加された 著者 chowwy,

Just change one to bind and add a check for :visible or :hidden

$(function(){
    $('.unstar').hide();
    var count1=0;

    $('.star').bind("click", function() { 
        if ($('.unstar').is(':hidden')) {
            count1++;
            $('.unstar').show();
            $('.star_number').html(count1);
        }
    });

    $('.unstar').bind("click", function() { 
        count1--;
        $('.unstar').hide();
        $('.star_number').html(count1);
    });    
});    

http://jsfiddle.net/j5qAs/3/

1
追加された
魅力のように動作します、ありがとう!
追加された 著者 chowwy,

OK、あなたのロジックを逆転させてください。 .starを隠すたびに.unstarを表示する必要があります。.unstarを非表示にすると、.starを表示する必要があります。

0
追加された