Question

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

任何人都可以帮助我吗？

Answer 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>

使用jekyll实现评估系统

1 个答案: