2017-02-09 80 views
0

後關閉評級星級您好,我想將評級星星放在我的網頁上。 它工作正常。評級被添加到數據庫 但是用戶可以一次又一次地進行評級。 我希望星星應該在一次之後停用。 這是我的代碼。請幫助我,謝謝。曾經評爲js

<!DOCTYPE html> 
<html lang="en"> 

<head> 
<link href="http://online-btw-berekenen.nl/rating/rating.css" rel="stylesheet" type="text/css"> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
<script type="text/javascript" src="http://online-btw-berekenen.nl/rating/rating.js"></script> 
<script language="javascript" type="text/javascript"> 
$(function() { 
    $("#rating_star").codexworld_rating_widget({ 
     starLength: '5', 
     initialValue: '', 
     callbackFunctionName: 'processRating', 
     imageDirectory: 'images/', 
     inputAttr: 'postID' 
    }); 
}); 

function processRating(val, attrVal){ 
    $.ajax({ 
     type: 'POST', 
     url: 'rating.php', 
     data: 'postID='+attrVal+'&ratingPoints='+val, 
     dataType: 'json', 
     success : function(data) { 
      if (data.status == 'ok') { 
       alert('You have rated '+val+' to CodexWorld'); 
       $('#avgrat').text(data.average_rating); 
       $('#totalrat').text(data.rating_number); 
      }else{ 
       alert('Some problem occured, please try again.'); 
      } 
     } 
    }); 
} 
</script> 
<style type="text/css"> 
    .overall-rating{font-size: 14px;margin-top: 5px;color: #8e8d8d;} 
</style> 
</head> 
<body style="background-color:black"> 
    <h1>Give us star</h1> 
    <input name="rating" value="0" id="rating_star" type="hidden" postID="1" /> 
    <div class="overall-rating">(Average Rating <span id="avgrat"><?php echo $ratingRow['average_rating']; ?></span> 
Based on <span id="totalrat"><?php echo $ratingRow['rating_number']; ?></span> rating)</span></div> 

</body> 
</html> 

在javascript中單擊並懸停功能。

(function(a){ 
    a.fn.codexworld_rating_widget = function(p){ 
     var p = p||{}; 
     var b = p&&p.starLength?p.starLength:"5"; 
     var c = p&&p.callbackFunctionName?p.callbackFunctionName:""; 
     var e = p&&p.initialValue?p.initialValue:"0"; 
     var d = p&&p.imageDirectory?p.imageDirectory:"images"; 
     var r = p&&p.inputAttr?p.inputAttr:""; 
     var f = e; 
     var g = a(this); 
     b = parseInt(b); 
     init(); 
     g.next("ul").children("li").hover(function(){ 
      $(this).parent().children("li").css('background-position','0px 0px'); 
      var a = $(this).parent().children("li").index($(this)); 
      $(this).parent().children("li").slice(0,a+1).css('background-position','0px -28px') 
     },function(){}); 
     g.next("ul").children("li").click(function(){ 
      var a = $(this).parent().children("li").index($(this)); 
      var attrVal = (r != '')?g.attr(r):''; 
      f = a+1; 
      g.val(f); 
      if(c != ""){ 
       eval(c+"("+g.val()+", "+attrVal+")") 
      } 
     }); 
     g.next("ul").hover(function(){},function(){ 
      if(f == ""){ 
       $(this).children("li").slice(0,f).css('background-position','0px 0px') 
      }else{ 
       $(this).children("li").css('background-position','0px 0px'); 
       $(this).children("li").slice(0,f).css('background-position','0px -28px') 
      } 
     }); 
     function init(){ 
      $('<div style="clear:both;"></div>').insertAfter(g); 
      g.css("float","left"); 
      var a = $("<ul>"); 
      a.addClass("codexworld_rating_widget"); 
      for(var i=1;i<=b;i++){ 
       a.append('<li style="background-image:url('+d+'/widget_star.gif)"><span>'+i+'</span></li>') 
      } 
      a.insertAfter(g); 
      if(e != ""){ 
       f = e; 
       g.val(e); 
       g.next("ul").children("li").slice(0,f).css('background-position','0px -28px') 
      } 
     } 
    } 
})(jQuery); 
+0

你在哪裏處理點擊星星? –

+0

@FanyoSILIADIN我添加了點擊js。請檢查 –

回答

0

OK,在你點擊處理程序只是刪除使用jQuery關()方法click事件偵聽器。

0

有幾個步驟來禁用點擊並在用戶中成功選擇了懸停事件(記錄&)評級:

添加一行到你的Ajax成功

success : function(data) { 
    if (data.status == 'ok') { 
     alert('You have rated '+val+' to CodexWorld'); 
     $('#avgrat').text(data.average_rating); 
     $('#totalrat').text(data.rating_number); 
     $('.codexworld_rating_widget').addClass('already_set'); 
    }else{... 

然後添加一個功能禁用每個懸停&單擊「http://online-btw-berekenen.nl/rating/rating.js」腳本中的<li>。見下面的例子:

g.next("ul").children("li").hover(function(){ 
    if ('.codexworld_rating_widget.alreadyset') { 
     $('.codexworld_rating_widget').off('click','li').off('hover','li'); 
    }else{ 

     // original script goes here 
    }); 

}); 

不管怎麼說,我不能測試它沒有建立一個沙箱,所以......希望它可以幫助你指出正確的方向。

+0

你有提到orignal腳本去這裏。你能告訴我哪個原始腳本? –

相關問題