Question

我有一个java脚本函数来显示评级.. 当用户点击星星评价我需要显示感谢您的评价消息，当用户刷新页面时，我需要显示感谢您的评分消息而不是评价这篇文章。以下是我的代码：任何人都可以帮助我吗？

<script type="text/javascript">


var sMax;   // Isthe maximum number of stars
var holder; // Is the holding pattern for clicked state
var preSet; // Is the PreSet value onces a selection has been made
var rated;

// Rollover for image Stars //



function rating(num){
    sMax = 0;   // Isthe maximum number of stars
    for(n=0; n<num.parentNode.childNodes.length; n++){
        if(num.parentNode.childNodes[n].nodeName == "A"){
            sMax++; 
        }
    }

    if(!rated){
        s = num.id.replace("_", ''); // Get the selected star
        a = 0;
        for(i=1; i<=sMax; i++){     
            if(i<=s){
                document.getElementById("_"+i).className = "on";
                document.getElementById("rateStatus").innerHTML = num.title;    
                holder = a+1;
                a++;
            }else{
                document.getElementById("_"+i).className = "";
            }
        }
    }
}

// For when you roll out of the the whole thing //
function off(me){
    if(!rated){
        if(!preSet){    
            for(i=1; i<=sMax; i++){     
                document.getElementById("_"+i).className = "";
                document.getElementById("rateStatus").innerHTML = me.parentNode.title;
            }
        }else{
            rating(preSet);
            document.getElementById("rateStatus").innerHTML = document.getElementById("ratingSaved").innerHTML;
        }
    }
}

// When you actually rate something //
function rateIt(me){
    if(!rated){
        document.getElementById("rateStatus").innerHTML = document.getElementById("ratingSaved").innerHTML + " :: "+me.title;
        preSet = me;
        rated=1;
        sendRate(me);
        rating(me);
    }
}

// Send the rating information somewhere using Ajax or something like that.
function sendRate(sel){
    alert("Your rating was: "+sel.title);
}


</script>





<form id="form1">


<span id="rateStatus">Rate This Article:</span>
<span id="ratingSaved">Thank you for rating.</span> 
<div id="rateMe" title="Rate Me...">
    <a onclick="rateIt(this)" id="_1" title="ehh..." onmouseover="rating(this)" onmouseout="off(this)"></a>
    <a onclick="rateIt(this)" id="_2" title="Not Bad" onmouseover="rating(this)" onmouseout="off(this)"></a>
    <a onclick="rateIt(this)" id="_3" title="Pretty Good" onmouseover="rating(this)" onmouseout="off(this)"></a>
</div>

Answer 1

您需要在用户评价文章时立即保存Cookie，并在再次加载页面时检查该Cookie值以确认文章是否已加载。

Answer 2

或者，如果您正在刷新页面，也可以从服务器获取本文的当前评级

Answer 3

这里有几个选项，你所做的将取决于你的要求。

最大问题是永久性问题。通过这个，如果我评价某些内容并获得感谢信息，我应该看到，如果我从手机浏览器或另一台计算机上的浏览器查看同一页面？否则，它只是一个需要显示一次的消息而你不在乎我以后再次看到“请评价”选项吗？

根据您关于在页面刷新之间保存状态的问题，听起来您的需求更多是为了节省持久性。

最终，保证永久保存评级状态的唯一方法是将其绑定到后端（服务器）应用程序上的用户帐户。这样，当我从其他浏览器查看同一页面时，或者很长一段时间后，服务器可以在数据库中查找并查看“Geuis对此进行评级，显示感谢信息”。

如果您只需要在短时间内显示谢谢，则可以将密钥存储在临时缓存中，例如memcache。在每次页面刷新时，一小段javascript可以向缓存服务器发出xhr请求，以检查我是否对页面进行了评级。最终密钥从缓存中掉出来，所以也许在我回去查看页面的一小时或一天内，我将被提示对页面进行评级。这是一个半永久性的解决方案，但它可以在任何设备或浏览器上运行，只要它绑定到一个帐户。

最脆弱但最简单的解决方案是纯客户端。在这里，您可以选择a）将评级/非评级值存储在cookie中，或b）使用localStorage。在任何一种情况下，它都会让国家存储起来。但 Cookie和localStorage不会在设备或浏览器之间传输。 localStorage不会过期，但最终会有cookie。此外，用户最终可以决定清除他们的cookie和localStorage缓存，并将状态设置回“给我评分”。

我没有提供任何代码示例，因为我希望你能看到，答案真的首先在完全你想要在永久性的范围内完成什么。

而且只是说，没有匿名永久性的东西。即您不能让用户对您的网站保持匿名，而是以在浏览器之间传输的方式永久保存其投票状态。您拥有类似于服务器端帐户的东西。

刷新页面后的JavaScript评级

3 个答案: