使用 jekyll 实现评估系统答案

【问题标题】：Implementing a evaluation system using jekyll使用 jekyll 实现评估系统
【发布时间】：2018-04-18 13:01:07
【问题描述】：

我正在改进一个使用 Jekyll 创建的网站。这个网站是一个企业的博客，里面有一些文字。我需要一个插件，让读者评估文本。但是，我还没有找到。

谁能帮帮我？

【问题讨论】：

【解决方案1】：

这个 Jekyll 网站（我创建的）使用评分表： http://www.stresan.de/perfekte-turniervorbereitung/

下面的代码依赖于一些 Javascript 和一个通过 CloudCannon 表单处理提交的表单。 Cloudcannon 可以很容易地被其他一些表单服务替换，例如 FormSpree、FormSubmit、FormBucket 或其他。帖子的初始值在 Front Matter 中设置。因此，这个评级系统部分是假的，但它提供了良好的反馈。

function setreviewval(val){
    var i=1;
	$('#review img').each(function(){
		if(i<=val) $(this).attr('src','http://www.stresan.de/img/star.svg');
		else $(this).attr('src','http://www.stresan.de/img/star-empty.svg');
		i++;
	});	
}
function setreviewvaldef(val){
	setreviewval(val);
	//remove mouseover and mouseout
	$('#review img').attr('onmouseover','');
	$('#review img').attr('onmouseout','');
}

img {width: 30px;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="review"><div>Bewerte diesen Artikel: </div>
<img src="http://www.stresan.de/img/star.svg" onmouseover="setreviewval(1);" onmouseout="setreviewval(4);" onclick="setreviewvaldef(1);$('#rating').val(1);$('#ratingform').show().attr('action',$('#ratingform').attr('action')+'#rating=1');" />
<img src="http://www.stresan.de/img/star.svg" onmouseover="setreviewval(2);" onmouseout="setreviewval(4);" onclick="setreviewvaldef(2);$('#rating').val(2);$('#ratingform').show().attr('action',$('#ratingform').attr('action')+'#rating=2');" />
<img src="http://www.stresan.de/img/star.svg" onmouseover="setreviewval(3);" onmouseout="setreviewval(4);" onclick="setreviewvaldef(3);$('#rating').val(3);$('#ratingform').show().attr('action',$('#ratingform').attr('action')+'#rating=3');" />
<img src="http://www.stresan.de/img/star.svg" onmouseover="setreviewval(4);" onmouseout="setreviewval(4);" onclick="setreviewvaldef(4);$('#rating').val(4);$('#ratingform').show().attr('action',$('#ratingform').attr('action')+'#rating=4');" />
<img src="http://www.stresan.de/img/star-empty.svg" onmouseover="setreviewval(5);" onmouseout="setreviewval(4);" onclick="setreviewvaldef(5);$('#rating').val(5);$('#ratingform').show().attr('action',$('#ratingform').attr('action')+'#rating=5');" />
<form method="POST" id="ratingform" action="{{ page.url }}"><input type="hidden" name="_to" value="jhvanderschee@gmail.com" />
<input type="hidden" name="post" value="{{ page.url }}" /><input id="rating" type="hidden" name="rating" value="" /><br />
<input type="text" name="comment" placeholder="Please clarify your score..." class="form-control" required="required" />
</form>
</div>

【讨论】：