0

我下载了 Jquery Raty 插件:https ://github.com/wbotelhos/raty

然后我将此文件夹结构安装到我的 {{static_url}}js 文件夹中,并将其命名为 Raty。

然后我将它导入到我的模板中,并将路径作为存储其图像的位置。

  <script type="text/javascript" charset="utf-8" src="{{ STATIC_URL }}js/raty/js/jquery.raty.min.js"></script>
  <script type="text/javascript" charset="utf-8">
    $(document).ready(function() {
         $('.thingrating').each(function(index){
          $(this).raty({
            readOnly:  false,
            path: "{{ STATIC_URL }}js/raty/img/",
            start: $(this).children("span:first").text(),
            click: function(score, evt) {
                var vote_url = "rate/" + this.attr('id').substring(2) + "/" + score + "/";
                $.ajax({
                  url: vote_url,
                  success: function(){
                    alert('vote successful');
                  }
                });
            }
          });
        });
    });
  </script>

这个对吗?我没有看到它在我的模板中工作,所以在我继续破译出了什么问题之前,要确保这个存储脚本并将其导入我的模板的过程是正确的......

这是我的模板的其余部分:

{% block body %}
    <h2>Things</h2>
        <div class="block" id="block-tables">
          <div class="content">
            <p></p>
            <div class="inner">
                <table class="table">
                  <tr>
                    <th class="first">Name</th>
                    <th class="last">Rating</th>
                  </tr>
                  <tr class="odd">
                    <td>{{ item.modelname }}</td>
                    <td><div class="thingrating" id="t_{{ item.id }}"><span style="display:none;">{{ score }}</span></div></td>
                  </tr>
                </table>
                <div class="actions-bar wat-cf">       
                </div>
            </div>
          </div>
        </div>
{% endblock %}
4

1 回答 1

1

看看这个jsfiddle演示。它工作正常(好吧,除了看起来start应该更改score为我理解你想要定义初始分数的方式)。不正确的图像路径根本不会破坏它。如果图像路径错误,浏览器将仅显示不可用图像的默认图标。不确定{{static_url}}变量中有什么。如果它包含类似“http://example.com/static”的内容 - 您必须在其后添加一个斜杠。

可能的问题 - rate 的脚本标记出现在 jQuery 之前。$(document).ready或者当事件发生时模板处理的结果在页面上不可用。

于 2012-10-29T16:09:56.570 回答