JS 仿騰訊發表微博的效果程式碼_javascript技巧

    this.cache = {};
    this.init(options);
 }

 Microblog.prototype = {

    constructor: Microblog,

    init: function(options) {
        this.config = $.extend(this.config,options || {});
        var self = this,
            _config = self.config,
            _cache = self.cache;

        // 点击输入框input 文本域 textarea 边框的变化
        $(_config.targetElem).each(function(index,item){

            $(item).unbind('focus');
            $(item).bind('focus',function(e){
                !$(this).hasClass(_config.activeCls) && $(this).addClass(_config.activeCls);
            });
            $(item).unbind('blur');
            $(item).bind('blur',function(e){
                $(this).hasClass(_config.activeCls) && $(this).removeClass(_config.activeCls);
            });
        });

        // 点击face头像 add(增加)类名
        var faceImg = $('img',$(_config.face));
        $(faceImg).each(function(index,item){
            $(item).unbind('click');
            $(item).bind('click',function(e){
                $(this).addClass(_config.currentCls).siblings().removeClass(_config.currentCls);
            });
        });

        // 廣播按鈕hover事件
        $(_config.sendBtn).hover(function(){
            !$(this).hasClass('hover') && $(this).addClass('hover ');
        },function(){
            $(this).hasClass('hover') & (this).removeClass(hover); > // 綁定事件
        self._bindEnv();
    },
   /*
    * @ return 字串的長度
     */
     _countCharacters: function(str) {
        {
var c = str.charCodeAt(i);
             if ((c >= 0x0001 && c              } else {  
               ,talCount =2;
             return totalCount;
     },
     /*
      * 所有的綁定事件
        * 所有的綁定事件
   _bindEnv: function() {
        var self = this,
           🎜>
        // 文字域keyup事件
        self._keyUp ();

        // 點選廣播按鈕事件
        self._clickBtn();      */
_keyUp: function() {
         var self = this,
            ;
         $(_config.textareaId).unbind('keyup');
         $(_config.textareaId).bind('keyup',function(){
                     html;
            if(_config .maxNum * 1 >= len * 1) {
                html = _config.maxNum * 1 - len *           html = _config.maxNum * 1 - len * 1;
}
             $(_config.maxNumElem).html(html);
            });
     },
     /*
      * 点击广播按钮事件
      */
     _clickBtn: function() {

        var self = this,
            _config = self.config,
            _cache = self.cache;
        var reg = /^\s*$/g;
        $(_config.sendBtn).unbind('click');
        $(_config.sendBtn).bind('click',function(){

            var inputVal = $(_config.inputID).val(),
                textVal = $(_config.textareaId).val(),
                maxNum = $(_config.maxNumElem).attr('data-html');
            if(reg.test(inputVal)) {
                alert('请输入你的姓名');
                return;
            }else if(reg.test(textVal)) {
                alert("随便说点什么吧!");
                return;
            }
            if(maxNum * 1 < 0) {
alert('字符超过限制 请缩减字');
return;
}
// 本来是要发ajax请求的 但是这边没有后台处理 所以目前只是客户端渲染页面
self._renderHTML(inputVal,textVal);
});
},
/*
* 把html结构渲染出来
*/
_renderHTML: function(inputVal,textVal) {
var self = this,
_config = self.config,
_cache = self.cache;
var oLi = document.createElement("li"),
oDate = new Date();
oLi.innerHTML = '

' +
                           ''+
                        '