e起飞young
一个前端码农的技术博客
emlog评论:添加表情
[ 2015/10/22 ]

QQ截图20170113173654.jpg

1.以默认模板为例,在module.php中评论框<p><textarea name="comment" id="comment" rows="10" tabindex="4"></textarea></p>前添加以下代码,以罗列出预设的表情

<div class="smiles" id="smiles">
  <?php for($i = 1; $i <= 21; $i++): ?>
  <img src="<?php echo TEMPLATE_URL; ?>images/smilies/<?php echo $i; ?>.gif" id="smilies<?php echo $i; ?>" width="20" height="20" alt="表情<?php echo $i; ?>" title="smilies<?php echo $i; ?>" />
  <?php endfor; ?>
</div>

2.将评论列表和子列表中的<?php echo $comment['content']; ?>替换为:

<?php echo preg_replace("#\|smilies(\d+)\|#i",'<img src="'.TEMPLATE_URL.'images/smilies/$1.gif" id="smilies$1" alt="表情$1"/>',$comment['content']); ?>

3.然后在footer.php中添加:

<script src="./content/templates/default/js/jquery-1.11.1.min.js" type="text/javascript"></script>
<script>
$("#smiles img").click(function(){
	a = $(this).attr("id");
	a = "|" + a + "|";
	$("textarea[name=comment]").append(a);
})
</script>

4.将下载解压后的smilies表情文件夹放到模板文件夹下的images文件夹中

文件下载:smilies.rar

OK,大功告成!

有朋自远方来...评论一下呗O(∩_∩)O

  • 评论(3)

    一丢丢 [ 回复 ] 3楼
    2018-06-23 00:06

    很棒,博主来个友链不?

    苏总 [ 回复 ] 2楼
    2017-05-28 12:46

    风神博客可以申请友链吗?http://fsboke.cn/

    风神博客 [ 回复 ] 1楼
    2017-05-28 12:44

    风神博客拜访

    搜索