实时点击/链接计数器

Question

我有了这个代码...

<script> 
     $(document).ready(function(){ 
    var x = 0;  
    function resetcounter() { 
    x = 0; 
    document.getElementById("counting").value = x; 
    } 

    function count() { 
    if(x<50) 
    { 
     x += 1; 
    } 
    else 
    { 
     x=0; 
    } 
    document.getElementById("counting").value = x; 
    } 
    $('#btn').click(

     function() { 
     count(); 
    }); 

    $('#reset').click(

    function() { 
      resetcounter(); 
    }); 
}); 
</script> 

它的伟大工程。但我需要它来实时更新。我想使用Firebase。 如何将资讯提供到Firebase中？基本上我需要这个...每当有人点击我网站上的某个按钮时，计数器会跟踪它被点击的次数，并实时显示给网页上的每个人。

Answer 1

这里的一般方法是将'x'变量移出到Firebase并使用它返回计数器的状态。由于我们正在对多个潜在客户进行计数，因此我们使用事务处理这些更新。

这将是这个样子：

var x = new Firebase('https://countingex.firebaseio-demo.com/'); 

x.on('value', function f(s) { 
    $('#counting').text(0 + s.val()); 
}); 

$('#btn').click(function() { 
    x.transaction(function(current_value) { 
    return current_value + 1; 
    }); 
}); 

$('#reset').click(function() { 
    x.set(0); 
}); 

我已经把working example up on JSFiddle;通过在多个窗口中打开它看看。为了简单起见，我忽略了有关魔术数字50的条件。

要开始使用其他Firebase基础知识，我建议您查看我们的interactive tutorial。