Back
Syntax
Study
Editor
Mode:
HTML
CSS
JavaScript
PHP
Reset
Run »
HTML / CSS / JS
$(function() { const $stars = $(".rating .star"); $stars.on("mouseenter", function() { const val = +$(this).data("value"); $stars.each(function(i) { $(this).toggleClass("filled", i < val); }); }).on("mouseleave", function() { const current = $("#rating-value").val() || 0; $stars.each(function(i) { $(this).toggleClass("filled", i < current); }); }).on("click", function() { const val = +$(this).data("value"); $("#rating-value").val(val); $.post("/api/rate", { rating: val, id: $(this).closest("[data-id]").data("id") }); }); });
Result
Open