1

我有一个 jQuery 星级评分，它与 jQuery 1.7.2 完美配合，但在使用 jQuery 1.8.0 时返回语法错误。这是脚本：

/* ====== STAR RATING ========= */
    jQuery(".stars.active a.star").hover(
        function(){
            var elemID = jQuery(this).parent('.stars').attr('id');
            elemID = elemID.replace('id-', '');

            if (od_readCookie('voted-'+elemID) == 'TRUE') {
                jQuery(this).siblings('.ty').html('You already voted.');
            } else {    

                var theClass = jQuery(this).attr('class');
                theClass = theClass.match(/^s[0-9]/);
                var starNum = theClass[0].replace('s', '');
                var allClasses = '';
                for(i=1;i<=starNum;i++) {
                    allClasses += ' .s'+i+', ';
                }
                jQuery(this).parent('.stars').children('.star').addClass('nogold');         
                jQuery(this).parent('.stars').children(allClasses).addClass('hover');
            }
        },
        function(){
            var elemID = jQuery(this).parent('.stars').attr('id');
            elemID = elemID.replace('id-', '');

            if (od_readCookie('voted-'+elemID) == 'TRUE') {
                jQuery(this).siblings('.ty').html('');
            } else {            
                jQuery(this).parent('.stars').children('.star').removeClass('nogold');                  
                jQuery(this).parent('.stars').children('.star').removeClass('hover');
            }
        }
    );

    // actually add the rating
    jQuery(".stars.active a.star").click(function(){
        var elemID = jQuery(this).parent('.stars').attr('id');
        elemID = elemID.replace('id-', ''); 

        if (od_readCookie('voted-'+elemID) != 'TRUE') {

            var theClass = jQuery(this).attr('class');
            theClass = theClass.match(/^s[0-9]/);
            var starNum = theClass[0].replace('s', '');


            // keep the marking while rating updating
            var allClasses = '';
            for(i=1;i<=starNum;i++) {
                allClasses += ' .s'+i+', ';
            }
            jQuery(this).parent('.stars').children('.star').addClass('nogold_voted');           
            jQuery(this).parent('.stars').children(allClasses).addClass('hover_voted');

            jQuery(this).siblings('.ty').load('/od/wp-admin/admin-ajax.php?action=od_add_vote&id='+elemID+'&rating='+starNum);
        }

    });

我对 jQuery 不熟悉，所以任何人都可以解释一下，究竟是什么导致了这个问题？

4

2 回答 2

0

好吧，我想我找到了。此代码导致问题：

var allClasses = '';
for(i=1;i<=starNum;i++) {
   allClasses += ' .s'+i+', ';
}
jQuery(this).parent('.stars').children('.star').addClass('nogold');         
jQuery(this).parent('.stars').children(allClasses).addClass('hover');

还有这个

var allClasses = '';
for(i=1;i<=starNum;i++) {
    allClasses += ' .s'+i+', ';
}
jQuery(this).parent('.stars').children('.star').addClass('nogold_voted');           
jQuery(this).parent('.stars').children(allClasses).addClass('hover_voted');

在这两种情况下allClasses，变量都以逗号结尾，因此最终选择器类似于.s0.s1,.s2,s3,s4,jQuery 1.7 中可接受的选择器，但在 1.8+ 中不起作用。

所以解决方案是从变量中删除最后一个逗号：allClasses = allClasses.slice(0, -1)在每个循环之后。

所以你应该得到这样的结果：

var allClasses = '';
for(i=1;i<=starNum;i++) {
   allClasses += ' .s'+i+', ';
}
allClasses = allClasses.slice(0, -1);

jQuery(this).parent('.stars').children('.star').addClass('nogold');         
jQuery(this).parent('.stars').children(allClasses).addClass('hover');

和

var allClasses = '';
for(i=1;i<=starNum;i++) {
    allClasses += ' .s'+i+', ';
}
allClasses = allClasses.slice(0, -1);

jQuery(this).parent('.stars').children('.star').addClass('nogold_voted');           
jQuery(this).parent('.stars').children(allClasses).addClass('hover_voted');
于 2012-08-31T08:38:55.503 回答
0

您可以通过向所有星星元素添加s类来简化代码并避免选择器问题。

然后很容易全选：

 // keep the marking while rating updating
 jQuery(this).parent('.stars').children('.star').addClass('nogold_voted');           
 jQuery(this).parent('.stars').children('.s').addClass('hover_voted');
于 2012-09-06T12:43:04.770 回答