jQueryのリセット星rating.js

Question

は私がhttps://danielupshaw.com/jquery-star-rating/

が、私は私のフォームをリセットしたい、このプラグインを使用しています。しかし、どうすればこれらの星をリセットできますか？

$("#btn-reset").on('click', function() { 
    //some other inputs reset 
    $('#starrating').star_rating.remove(); 
    $('#starrating').star_rating.reload(); 
} 

これらのスターをゼロまたはヌルにリセットする方法をお手伝いしてください。

ここに完全なコードがあります。

$("#btn-reset").on('click', function() { 
    $('#starrating').star_rating.reload(); 
}); 
    jQuery(function($) { 
    $('#starrating').star_rating({ 
     click: function(clicked_rating, event) { 
      event.preventDefault(); 
      $('input[name=\'rating\']').val(clicked_rating); 
      this.rating(clicked_rating); 
     } 
    }); 
}); 

Answer 1

これが最善のアプローチであれば、私はこのライブラリに慣れていないよので、私は...、

を知らないが、私はこのようなリセットを達成：

$(document).ready(function(){ 
 
    $('.rating').star_rating(); 
 

 

 
    $("#resetStars").on("click",function(){ 
 
    $(".rating").remove(); 
 
    $('.star-rating').replaceWith("<span class='rating'>0/10 stars</span>"); 
 
    $(".rating").text("0/10").star_rating(); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet"/> 
 
<script src="https://danielupshaw.com/jquery-star-rating/jquery.star-rating.js"></script> 
 

 

 
<h1>This is a good script!</h1> 
 
<span class="rating">9.5/10 stars</span><br> 
 
<br> 
 
<br> 
 
<button id="resetStars">Reset stars</button>

Answer 2

それはあなたがする必要があるすべては0にコンテンツを設定されているようにその後の方法を再初期化に見えます。

$("#starrating").html("0"); 
$("#starrating").star_rating(); 

Answer 3

私はプラグインに慣れていないんだけど、あなたが提供されたリンクを見て、あなただけの空またはゼロの評価を反映する要素の内のテキストを更新することはできませんか？ような何か：

$("#btn-reset").on('click', function() { 
    $('#starrating').text('0/5').star_rating(); 
} 

Answer 4

あなたはこのような何かを試みることができます。試みはデフォルトの空白の星を初期ページの負荷でに設定するか、をクリックします。

$(document).ready(function() { 
    $('i').addClass('fa-star-o'); 
}); 

そして、残りの部分にページを更新：

$(".reset").click(function() { 
    location.reload(); 
}); 

ページを更新したくない場合は、あなたが試みることができる：

$(".reset").click(function() { 
    $('i').addClass('fa-star-o'); 
}); 

あなたが再起動あなたのクリックする必要があり必要に応じて適切なクラスを追加するために、同様のjQueryを持つ星の機能。

これは役に立ちません。問題を完全に複製するにはhttps://jsfiddle.net/を作成してください。それを解決することができました。 それは私だったら;私はより良いプラグインを使用するか、その時点でゼロから書くだけです。

Answer 5

カスタムrenderRating機能を使用して、評価の星を最初から再描画することによって少し別のアプローチがあります。

HTML：

<div class="rating-stars"></div> 
<button class="reset-rating">Reset rating</button> 

JS：

var defaultRating = "0/5"; 

renderRating("3/5"); 

function renderRating(rating) { 
    var ratingEl = $('<span />').addClass('rating'); 
    var ratingStr = rating || defaultRating; 

    ratingEl.text(ratingStr); 
    $('.rating-stars').html(ratingEl); 
    ratingEl.star_rating(); 
} 

$('.reset-rating').on('click', function() { 
    renderRating(); 
}) 

Preview on JSFiddle

Answer 6

これが0にリセットする必要があります

$('#starrating').star_rating('rating', 0);あなたのクリックイベントの準備ができて、文書内にある必要があります

$('#starrating').star_rating('method_name');

：

は、ここでのパブリックメソッドを呼び出すための形式ですか？ドキュメントの準備ができていない場合は、問題が発生することがあります。私はこれが助けてくれることを願っています:)