discuzx 中加入分类打分代码

最近做了一个功能，分类打分。再次分享一下。因为涉及到很多地方，所以你拿去肯定不能直接用。明白了原理，然后再做修改。这个功能是discuzx中摘出来的。
先来HTML代码部分
6项打分，这个是html代码部分，在discuzx中是用函数循环输出这些的。
然后是CSS部分

1. .star_rating, .star_rating a:hover, .star_rating a:active, .star_rating a:focus, .star_rating .current_rating {background: url("images/star.gif") left -1000px repeat-x;}
   
2. .star_rating {background-position:left top;height: 14px;list-style: none outside none;margin: 0;overflow: hidden;padding: 0;position: relative;width:75px;margin-left:3px;}
   
3. .star_rating li {display: inline;display: block;float: left;}
   
4. .star_rating a, .star_rating .current_rating { border: medium none;height: 14px;left: 0;line-height: 14px; outline: medium none; overflow: hidden; position: absolute; text-indent: -1000em; top: 0;}
   
5. .star_rating a:hover, .star_rating a:active, .star_rating a:focus { background-position: left bottom;}
   
6. .star_rating a.one_star {width: 15px; z-index: 6;}
   
7. .star_rating a.two_star {width: 30px;z-index: 5;}
   
8. .star_rating a.three_star { width: 45px;z-index: 4;}
   
9. .star_rating a.four_star { width: 60px; z-index: 3;}
   
10. .star_rating a.five_star { width: 75px; z-index: 2;}
    
11. .star_rating .current_rating {background-position: left bottom;z-index: 1;}

复制代码

投票的部分是通过绑定 onclick事件进行的

1. <script type="text/javascript">
   
2. var rating_group = new Array();
   
3. var rating_types = new Array();
   
4. rating_types[0] = 'traffic';
   
5. rating_types[1] = 'environment';
   
6. rating_types[2] = 'design';
   
7. rating_types[3] = 'facilities';
   
8. rating_types[4] = 'developer';
   
9. rating_types[5] = 'management';
   
10. 
    
11. function rating(obj){
    
12. if( $_G['uid'] == 0){
    
13. showDialog('{lang house_rating_login}','notice');
    
14. return false;
    
15. }
    
16. var score = obj.id.substr(0,1);
    
17. var type = obj.id.substr(2);
    
18. var rating = score*15;
    
19. $(type+'_current_rating').style.width = rating+'px';
    
20. rating_group[type] = score;
    
21. var flag = true;
    
22. for( var i=0; i<rating_types.length; i++) {
    
23. if( !(rating_types[i] in rating_group)) {
    
24. flag = false;
    
25. }
    
26. }
    
27. if(flag){
    
28. var ratingstr = "";
    
29. ratingstr += "HASH:{FORMHASH}";
    
30. for( type in rating_group){
    
31. ratingstr += "," + type + ":" + rating_group[type];
    
32. }
    
33. ajaxget('house.php?mod=misc&ac=rating&hid=$tid&ratingstr='+ratingstr, null, null, '', '', function() {
    
34. showDialog('{lang house_rating_success}','notice', '', '', '', '', '', '', '', 2);
    
35. window.location.reload();
    
36. });
    
37. rating_group = new Array();
    
38. }
    
39. }
    
40. </script>

复制代码

js中做了判断，只有6项都进行评分后才会提交分数
提交分数是用dx中的ajaxget函数进行的。

1. ajaxget('house.php?mod=misc&ac=rating&hid=$tid&ratingstr='+ratingstr, null, null, '', '', function() {
   
2. showDialog('{lang house_rating_success}','notice', '', '', '', '', '', '', '', 2);
   
3. window.location.reload();
   
4. });
   

复制代码

后台处理部分就属于php常规的一些操作了。就写到这吧。

效果如图

用到的星星图片

耶~这次我是沙发

耶~这次我是沙发

简单易懂吗？看的明白吗？

这个功能不错

老大多多出这些美化的方法呗
2.5有这功能吧

不了接技术啊

么办法

只有等以后有大侠做现成的，来用了

辛苦了

支持了，虽然不懂技术... 不过这些貌似不是给站长看的，哈哈！！

支持一下。