很久之前闲着没事仿照新浪微博的发布与删除，写过一次代码！那时主要是实现滑动的效果，不过代码却是非常的乱，html与css样式混用等。可是这段代码也没怎么用过，就一直在那扔着。点击查看效果
直到昨天下午，有一妹子说她想实现那种跟新浪微博似的那种效果，我才想起我原先也写过这个东西，不过因为那时的代码啊有段乱，也就没给妹子推荐。然后晚上回到家后，就把我一年前写的代码重新设计了一下，相对来说结构更加清晰了一些！
新代码和旧代码都放在一个仓库里，不过这两个没有纠缠。旧代码就一个文件：microblog.html，剩下的全部都是新代码，若不想要旧的代码，删了这个文件就是。
放上代码地址：github-microblog
说下这次的重构主要都进行了哪些工作：
更新了jQuery的版本：由1.7.1升级到了1.11.1，同时也废除了live方法，改用on;
把html, css与js进行相互的分离，不再集合到一个文件里；
添加了字数的统计和限制，最多只能输入140个字；
添加了输入框为空或字符超过限制时的提示；
添加了表情的插入
这次重写也学到了很多的东西，比如CSS3中的animation，字数的限制，表情的添加等。
点击链接【新的效果页面】，看看重构后的效果。
1. CSS3中的ANIMATION
在输入框为空时或者字数超过了限制，输入框就是闪两下进行提示，这是通过CSS3中的animation属性实现的。关于animation更多的介绍，可以参考这个链接，本文就不展开说明了，你可以通过此链接【CSS3的animation】查看animation更多详细的信息与使用，这里简单的介绍下animation的使用：
.send .warning{
background: #fff;
-webkit-animation:'wobble' 0.8s ease-in-out;}@-webkit-keyframes wobble{
0%{background: #fff;}
25%{background: #FFC0CB;}
50%{background: #fff;}
75%{background: #FFC0CB;}
100%{background: #fff;}} animation中的参数分别表示：
+ 'wobble' : 动画的名称，随便定义
+ 0.8s : 动画执行的总时间
+ ease-in-out : 动画执行的方式
在wobble的结构体里，有很多的百分比数字，这些就是在0.8s里的执行时间里的各个进度，我们可以定义每个当前进度展示怎样的属性。
定义了样式，还要确定触发点是什么？当用户点击确定“发布”按钮或者使用ctrl+enter组合键时进行信息的校验，如果输入框为空或者字数超过了限制，那么textarea标签就添加warning类，执行完成后再去掉该类名。
timer : null,warning : function(){
$("#say").addClass( "warning" );
this.timer && clearTimeout(this.timer);
this.timer = setTimeout(function(){
$("#say").removeClass( "warning" );
}, 800);}2. 字数的限制
字数的限制，叫实时显示剩余字数更加确切一些。在这里我是让textarea标签监听keydown事件实现的，这里为什么不选择监听keypress或keyup事件呢？因为：
keypress与keydown事件差不多，keydown是监听按键按下事件，keypress是监听按下与松开事件；但是keypress只能监听单个按键事件，不能监听组合按键。这里使用到了ctrl+enter组合按键提交，因此就不能使用keypress了；关于keydown和keyup，假如在输入英文字符或者数字时，虽然按键一直没有松开，但是一直在进行输入（没有松开按键则表示keydown事件无限执行），那么如果使用keyup事件来计算剩余字数就不准确了。因此最终选择了keydown事件
每次执行keydown事件时，均获取textarea的值的长度，然后计算出剩余的字数，如果剩余字数为0，则不再让用户进行输入。
3. 将内容添加到列表中
参考现在的html结构，每条留言都是一个li标签，因此插入新留言时，也是要插入一个li标签。正常情况下，应该是：
添加成为ul标签的第一个li标签
默认隐藏这个刚添加的li标签
使用slideDown()、fadeIn()等函数显示出来
可是这里，在我的代码里，有一个很难理解的问题：需要添加的li标签必须添加成为第二个li标签，如果是添加成为第一个li标签，执行显示动画或者删除该留言时，会闪动一下，也不知道为什么？ 不知有谁能解决下不？
var $ul = $("#talklist"),
$one = $(''+word+'
'+datetime+'删除 