使用 JQuery 评分星并将数据提交给分析

Question

我在实现 JQuery 星级评分插件时遇到了一些问题。有问题的插件可以在http://orkans-tmp.22web.net/star_rating/找到

我遇到的麻烦是将分数传递给 Google 分析。我已经设法实现了插件，但由于某种原因，代码不会触发分析自定义事件。单击星星时会提醒正确的当前值，这是我要传递给 Google 分析事件跟踪的值。

任何帮助将不胜感激，我的代码如下：

<link rel="stylesheet" type="text/css" media="screen" href="css/styles.css"/>   
<script type="text/javascript" src="js/jquery.min.js></script>
<script type="text/javascript" src="js/jquery-ui.custom.min.js"></script>
<script type="text/javascript" src="js/jquery.ui.stars.js"></script>
<link rel="stylesheet" type="text/css" href="css/jquery.ui.stars.css"/>


<script type="text/javascript">
    var url = location.href;

    $(function ratingStars(){
        $("#ratings").stars({
            captionEl: $("#stars-cap"),
            oneVoteOnly: false,
        });
    });

    $(document).ready(function(){
        $('.ui-stars-star').click(function() {
            // Retrieve instance
            var ui = $("#ratings").data("stars");
            var currValue = ui.options.value;
            //alert the currValue to make sure it is in place.
            alert(currValue);
           //send data to track
          _gaq.push(['_trackEvent', 'UATRatingTest', 'UATRatingTest2', url, currValue]);
        });
    });
</script>

<div class="RatingStars">
    <form id="ratings">
        <input type="radio"  name="rate" value="1" title="Poor" id="rate1" />
        <input type="radio"  name="rate" value="2" title="Fair" id="rate2" /> 
        <input type="radio"  name="rate" value="3" title="Average" id="rate3" /> 
        <input type="radio"  name="rate" value="4" title="Good" id="rate4" /> 
        <input type="radio"  name="rate" value="5" title="Excellent" id="rate5" />
    </form>
<span style="margin-right:5px; margin-left:10px;"> Rating: </span> <span id="stars-cap"></span> <br/>

插件创建一个

<div class="ui-stars-star"> 

对于每颗星，这就是为什么我在其上添加了点击功能，以尝试提交给定的分数。

如果有人以前使用过该插件，那就太好了。

谢谢，

西蒙

Answer 1

我找到了问题的答案。似乎 currValue 被解析为字符串，而不是分析触发脚本所需的整数。我通过使用以下代码将值转换为整数来解决它：

var myString = currValue;
var myConvertedInteger;
myConvertedInteger = parseInt(myString);
//Check string has been converted 
alert(myConvertedInteger);
_gaq.push(['_trackEvent', 'UATRatingTest', 'UATRatingTest2', url, myConvertedInteger]);

感谢您的意见，罗里。

Answer 2

如果正在动态创建具有.ui-stars-star 类的元素，请尝试使用live() 方法来连接它们的事件：

$('.ui-stars-star').live("click", function() { ...

或者，如果你使用的是 jQuery 1.7，你可以使用on()

$('.ui-stars-star').on("click", function() { ...