文字变换 & Event Handler

编辑需要文字变换的效果，显示由前段来实现效果，在交给后台去填，这是最后的效果。

其实用jQeury来做在脑海中一开始就有了步骤，但是没想到尽然为了些还不完全掌握的小细节（特别是Event Handler）卡了几个小时不停调试。

而且就算现在完成也没法说已经优化的非常得当。

 

最早的问题出在当点击最外层的container时候应该出发的事件，到了点击里面一个个文字的时候也同时出发：

$(".con").on("click",showNext)

到Stackoverflow上面问了一下，才明白：

Events are always dispatched to the target-element(the child-p in this case) and first trigger the event-listeners there(if any). Bubbling events(like click) then will also trigger the event for any parent, up to the document-object(this is "bubbling").

简单的说就是所有事件都会发送到目标元素和第一个出发他的元素，所以要取消所有P的事件监听则需要手动将里面的自动发送过去的事件监听去除：

$(".con").on("click",showNext).children("p").on('click',function(e){e.stopPropagation();})

====================更新AutoRun=======================