为什么这个星级评级的javascript / CSS不起作用?

时间:2017-01-10 07:51:49

标签: javascript jquery html css

我已经尝试了很长一段时间才能让Nick Salloum的这个5星评级控制工作: http://callmenick.com/post/five-star-rating-component-with-javascript-css

以下是我的尝试:https://jsfiddle.net/n6qzkpcy/2/

任何人都可以看到我做错了它没有显示任何明星吗?

// target element
var el = document.querySelector('#el');

// current rating, or initial rating
var currentRating = 0;

// max rating, i.e. number of stars you want
var maxRating= 5;

// callback to run after setting the rating
var callback = function(rating) { alert(rating); };

// rating instance
var myRating = rating(el, currentRating, maxRating, callback);

1 个答案:

答案 0 :(得分:2)

<!DOCTYPE html>
<html lang="en">
<head>
  <title>Five Star Rating</title>
  <link rel="stylesheet" href="css/font-awesome.min.css">
  <link rel="stylesheet" href="css/style.min.css">
  <link rel="stylesheet" href="css/rating.min.css">
</head>
<body>

<ul class="c-rating" id="el">

</ul>

<script src="js/dist/rating.min.js"></script>
<script type="text/javascript">
    var el = document.querySelector('#el');

    // current rating, or initial rating
    var currentRating = 1;

    // max rating, i.e. number of stars you want
    var maxRating= 5;

    // callback to run after setting the rating
    var callback = function(rating) { alert(rating); };

    // rating instance
    var myRating = rating(el, currentRating, maxRating, callback);

</script>
</body>
</html>

请使用上面的HTML页面并放置从git下载的所需资源。你会看到结果。