作者:LAMP小白 点击:3796 发布日期:2012-12-06 00:21:00 返回列表
emoticon能够帮助我们生成一个微博表情窗,点击就能够插入表情,而且在新浪微博中可以完美的进行解析
首先emoticon需要加载两个额外的文件(当然jquery是必须的~)
jquery.emoticons.js
emoticon.css
和两张图片和一个图片文件夹
layer_arrow.png
delete_items.gif
1.常规设置
出现表情窗口需要设置:
$(mio_quot;#点击什么出现表情mio_quot;).jqfaceedit( { txtAreaObj:$(mio_quot;输入框mio_quot;),containerObj:$(mio_#39;#容器mio_#39;),top:0,left:0 } );
需要注意的是容器,他会根据容器进行定位,所以一般选择点击按钮的父级如果不够大,那么可以选择父级的父级
解析表情文字需要设置:
$(mio_#39;#输出框mio_#39;).html($(mio_#39;#输入框mio_#39;).val());
获取输入框的表情文字
$(mio_#39;#输出框mio_#39;).emotionsToHtml();
将文字解析成图片
就是这么简单,不过不要高兴,你的文件会像插件这样摆放吗?我想不会,所以接下来需要修正几个地方
2.修改一些代码
jquery.emoticons.js
179行var t = mio_quot;mio_lt;img src=mio_#39;emotions/mio_quot; + em[n].url + mio_quot;mio_#39; /mio_gt;mio_quot;;
104行 faceHtml += mio_#39;mio_lt;li text=mio_#39; + options.emotions[i].phrase + mio_#39; type=mio_#39; + i + mio_#39;mio_gt;mio_lt;img title=mio_#39; + options.emotions[i].phrase + mio_#39; src=mio_quot;emotions/mio_#39;+ options.emotions[i].url + mio_#39;mio_quot; style=mio_quot;cursor:pointer; position:relative;mio_quot; /mio_gt;mio_lt;/limio_gt;mio_#39;;
emoticon.css
80行 background: url(mio_quot;delete_items.gifmio_quot;) no-repeat scroll transparent;
87行 background: url(mio_quot;layer_arrow.pngmio_quot;) no-repeat scroll 0 0 transparent;
修改好了?别急,你点表情后,输入框会有东西吗? tc is null?
我们还要修正一个BUG
jquery.emoticons.js
119行
var tc = document.getElementById(textareaid); 直接写输入框的ID吧
OK结束
上一篇:AOP运用在用户注册 下一篇:快递查询API