一度評価の後に評価の星を無効にするjs

こんにちは私のウェブページに評価の星を入れたいです。正常に動作しています。評価はデータベースに追加されていますが、ユーザーは何度も繰り返し評価することができます。私はその星が一度のレートの後に無効にしたいと思っています。ここに私のコードです。親切に私を助けてくれてありがとう。一度評価の後に評価の星を無効にする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);

出典

2017-02-09 naveed Softdukan

あなたはどこで星をクリックしますか？ –

@FanyoSILIADINクリックjsを追加しました。ご確認ください –

[OK]をクリックすると、jquery off（）メソッドを使用してクリックイベントリスナーを削除するだけです。

出典

2017-02-09 13:58:54

ユーザーが正常に選択した後、イベントをクリックして推移し無効にするには、いくつかの手順（&が記録さ）の評価があります

があなたの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 
    }); 

});

、私はサンドボックスを構築することなく、それをテストすることはできないんだけど、そう...それは正しい方向にあなたを指すように役立ちます願っています。

出典

2017-02-09 14:42:33 cpardon

あなたはここにorignalスクリプトがあると言いました。元のスクリプトを教えてください。 –

一度評価の後に評価の星を無効にするjs

答えて

関連する問題