JavaScript code implements the _javascript technique of imitating instantiation class

The more things that JavaScript can do, with the problem is the increase in the number of JS code, in the face of the code, I chose The imitation of the class instantiation of the constructor in the form of automatic start, all the JS code, in a registered format, class.

Code

/** * @version $Id $ * @author xjiujiu <xjiujiu@foxmail.com> * @description hhjslib Framework Apps * @copyright Copyright (c) 2011-2012 http://www.xjiujiu.com.All right Reserved * * Hhjslib.register ({init:function () {this.b
    INDPREVIEWBTN ();
    THIS.BINDUPLOADELEIMAGEBTN ();
    THIS.BINDUPLOADELEAUDIOBTN (' a.audio-upload-btn ');
    THIS.BINDUPLOADELEVIDEOBTN (' a.video-upload-btn ');
    THIS.BINDDOWNLOADELEAUDIOBTN ();
    THIS.BINDNEWCONBTN ();
    THIS.BINDDELCONBTN (' A.btn-del-con ');
    THIS.BINDDELITEMBTN (' A.btn-del-item ');
    This.bindnewitemboxclose (' Div.item-box ');
    THIS.BINDPLUSBTN (' A.btn-plus ');
    This.bindappendnewelement (' Div.new-item-box ul li a ');
    This.bindsetpreviewvideo ();
    THIS.BINDADDANSWERBTN (' A.btn-add-answer ');
    THIS.BINDDELANSWERBTN (' A.btn-del-answer ');
    THIS.BINDDELIMAGEBTN (' a.btn-del-image ');
    THIS.BINDDELAUDIOBTN (' A.btn-del-audio ');
  THIS.INITPLUSBTN ();
}, Binduploadelevideobtn:function (DOM) {var self = this;    $ (DOM). Click (function () {var $this = $ (this); var t = HHJsLib.modal.confirm (' Upload local video ', ' <div class= ' text-center ' > ' + ' <p> browse your computer, Select a video file from. </p> ' + ' <div class= "Btn-box btn btn-blue" > ' + ' <div id= "upload-btn" > Upload from PC </div>
      ' + ' </div> ' + ' </div> ');
        var uploader = hjzuploader.createvideo (' #upload-btn ', {formData: {model: ' Timeline '},
            }, function (response) {if (false = = response.rs) {self.setdemoboxinit ($this);
          Return Hhjslib.warn (Response.message);
          Self.setdemoaudioinfo ($this, response.data);
        $ (' #dialog-box-' + t). Modal (' hide ');
      }
      );
      Uploader.on (' uploadprogress ', function (file) {self.setdemoboxloading ($this);
 
      });
    return uploader;
  }); }, Binddelaudiobtn:function (DOM) {This.binddelfilEBTN (DOM, ' really want to delete this audio?
  '); }, Binddelimagebtn:function (DOM) {this.binddelfilebtn (DOM, ' really want to delete this picture?
  ');
    }, Binddelfilebtn:function (DOM, msg) {var self = this;
      $ (DOM). Click (function () {var $target = $ (this);
      var t = Hhjslib.initpopover ($ (this), MSG);  $ (' #btn-sure-' + t). Click (function () {if (1!= $target. attr (' data-new ')) {$.get (Queryurl + ' Timelineele/adel ', {ID: $target. attr (' Data-id ')}, function (response) {if (false = =
              = response.rs) {return Hhjslib.warn (response.message);
              } self.deldemofieldinfo ($target);
            $target. PopOver (' destroy ');
          }
          );
        Return
        } self.deldemofieldinfo ($target);
      $target. PopOver (' destroy ');
    });
  });
    }, Deldemofieldinfo:function ($target) {$ ($target. attr (' Data-demo-box ')). html ('); $ ($target. attr (' Data-box ')). RemoveclaSS (' uploaded '). addclass (' No-file ');
  $ ($target. attr (' Data-field ')). attr (' Data-id ', '). attr (' data-src ', ');
    }, Bindaddanswerbtn:function (DOM) {var self = this;
      $ (DOM). Click (function () {var id = $ (this). attr (' Data-id ');
      var answerhtml = EleTplMap.answerTpl.replace (/{id}/g, id);
      $ (' #answer-box-' + ID). append (answerhtml);
    SELF.BINDDELANSWERBTN (' #answer-box-' + ID + ' a.btn-del-answer ');
  });
    }, Binddelanswerbtn:function (DOM) {var self = this;
      $ (DOM). Click (function () {var $target = $ (this); if (2 > $target. Parent (). Parent (). Find (' textarea.answer-editor '). Length) {return Hhjslib.warn (' At least one answer is needed!
      '); var t = hhjslib.initpopover ($target, ' Are you sure you want to delete this answer?
      ');
      $ (' #btn-sure-' + t). Click (function () {$target. Parent (). remove ();
    });
  });
    }, Bindappendnewelement:function (DOM) {var self = this; $ (DOM). Unbind (' click '). Click (function () {var type = $ (this). attr (' Data-type ');
      var heading = $ (this). Parent (). Parent (). attr (' Data-heading-id ');
        if (' heading ' = = Type) {Self.addnewelepartbox ();
        $ ("#new-item-box-" + heading). Hide ();
      Return
    } self.addneweletopartbox (heading, type);
  });
    }, Addnewelepartbox:function () {var t = This.gettimestamp ();
    var partboxhtml = EleTplMap.partBox.replace (/{t}/g, T);
    var headinghtml = This.inititemtplbytype (' Heading ', T, T);
    var itemhtml = this.inititemtplbytype (' text ', T, T);
    var itemboxhtml = This.inititemboxtpl (itemhtml, T, T, ' left ', ' text ');
    partboxhtml = Partboxhtml.replace (/{heading}/g, headinghtml);
    partboxhtml = Partboxhtml.replace (/{item}/g, itemboxhtml);
    $ ("#main-box"). Append (partboxhtml);
    THIS.BINDDELITEMBTN (' #item-' + t + ' a.btn-del-item ');
  This.moveplusbtnbox (t); }, Addneweletopartbox:function (heading, type) {var total = $ (' #ele-part-box-' + heading + ' Div.item-ele-box '). LengTh var side = Total% 2 = 0?
    ' Left ': ' Right ';
    var t = This.gettimestamp ();
    var itemhtml = This.inititemtplbytype (type, t, heading);
    var itemboxhtml = This.inititemboxtpl (itemhtml, heading, T, side, type);
    Clear out the original height div $ (' #clearfix-' + heading). Remove ();
    $ (' #ele-part-box-' + heading). Find (' Div.eles-box '). Append (itemboxhtml);
    Bind DOM Event this.binddelitembtn (' #item-' + t + ' a.btn-del-item ');
    This.moveplusbtnbox (heading);
  This.bindneweleupload (type);
    }, Bindneweleupload:function (type) {var self = this;
      Switch (type) {case ' image ': case ' question ': Case ' know ': self.binduploadmodal (' a.btn-upload ');
      Break
      Case ' audio ': self.binduploadeleaudiobtn (' a.audio-upload-btn ');
      SELF.BINDDELAUDIOBTN (' A.btn-del-audio ');
    Break
    }, Inititemtplbytype:function (type, T, heading) {var itemhtml = Eletplmap[type].replace (/{t}/g, T); itemhtml = Itemhtml.replace (/{sOrt_num}/g, This.getnewelesortnum (heading));
  Return Itemhtml.replace (/{headingid}/g, heading); }, Inititemboxtpl:function (content, heading, T, side, type) {var itemboxhtml = EleTplMap.itemBox.replace (/{t}/g, t
    );
    itemboxhtml = Itemboxhtml.replace (/{headingid}/g, heading);
    itemboxhtml = Itemboxhtml.replace (/{side}/g, side);
    itemboxhtml = Itemboxhtml.replace (/{content}/g, content);
    itemboxhtml = Itemboxhtml.replace (/{hash}/g, HEX_MD5 (t));
     
    itemboxhtml + = ' <div class= ' clearfix ' id= ' clearfix-' + heading + ' ></div> ';
  Return Itemboxhtml.replace (/{type}/g, type);
    }, Moveplusbtnbox:function (heading) {//delete original $ (' #new-item-box-' + heading). Remove ();
    Add new var plusbtnhtml = EleTplMap.plusBtn.replace (/{headingid}/g, heading);
    $ (plusbtnhtml). InsertBefore (' #clearfix-' + heading);
    var $items = $ (' #ele-part-box-' + heading). Find (' Div.item-ele-box '); if ($items. Length < 2) {$ ($items [0]). Find (' A.btn-del-item '). Hide ();
    else {$ ($items [0]). Find (' A.btn-del-item '). Show ();
    }//Binding event This.bindappendnewelement (' #new-item-box-' + heading + "Ul.new-item-list-box li a");
  THIS.BINDPLUSBTN (' #btn-plus-' + heading);
    }, Bindnewitemboxclose:function (DOM) {$ (DOM). Click (function () {$ (' div.new-item-box '). Hide ();
  });
      }, Bindplusbtn:function (DOM) {$ (DOM). Click (Function (Event) {$ (' div.new-item-box '). Hide ();
      var id = $ (this). attr (' Data-heading-id ');
      $ (' #new-item-box-' + ID + ' Div.new-item-box '). Removeclass (' hide '). attr (' data-show ', ' 1 '). Show ();
    Event.preventdefault ();
  });
    }, Initplusbtn:function () {var self = this;
      $ (' Div.ele-part-box '). each (the function () {var dataid = $ (this). attr (' data-heading ');
    Self.moveplusbtnbox (Dataid);
  });
    }, Binddelitembtn:function (DOM) {var self = this;
      $ (DOM). Click (function () {var $target = $ (this); var t = hhjslib.inItpopover ($target, ' Are you sure you want to delete this item?
      ');
      var id = $target. attr (' Data-id ');
      var heading = $ (' #item-' + ID). attr (' Data-heading-id ');  $ (' #btn-sure-' + t). Click (function () {if (1 = $target. attr (' data-new ')) {$.get (Queryurl + ' Timelineele/adel ', {ID: $target. attr (' Data-id ')}, function (response) {if (false = =
              = response.rs) {return Hhjslib.warn (response.message);
                } $ (' #item-' + ID). fadeout (' Fast ', function () {$ (this). Remove ();
                Self.moveplusbtnbox (heading);
              Self.rearrangeitem (heading);
              });
            $target. PopOver (' destroy ');
          }
          );
        Return
        $target. PopOver (' destroy ');
          $ (' #item-' + ID). fadeout (' Fast ', function () {$ (this). Remove ();
          Self.moveplusbtnbox (heading);
        Self.rearrangeitem (heading);
      });
    }); });
    }, Rearrangeitem:function (heading) {var rank = 1; $ (' #ele-part-box-' + heading). Find (' Div.item-ele-box '). each (function () {if (rank% 2 = 0) {$ (this). Remove
      Class (' Pull-left item-left '). addclass (' Pull-right item-right ');
      } else {$ (this). Removeclass (' Pull-right item-right '). addclass (' Pull-left item-left ');
    Rank + +;
  });
    }, Bindnewconbtn:function () {var self = this;
      $ (' #btn-new-con-item '). Click (function () {var t = Self.gettimestamp ();
      var conitemhtml = EleTplMap.conItemTpl.replace (/{t}/g, T);
      $ (' #conclusion-box '). Append (conitemhtml);
      SELF.BINDDELCONBTN (' #btn-del-con-' + t);
    Self.binduploadmodal (' a.btn-upload ');
  });
    }, Binddelconbtn:function (DOM) {var self = this;
      $ (DOM). Click (function () {var $target = $ (this); var t = hhjslib.initpopover ($target, ' Are you sure you want to delete this conclusion?
      ');
      var id = $target. attr (' Data-id '); $ (' #btn-sure-' + t '. Click (function () {if (1 = $target. attr (' data-new ')) {$.get (Queryurl + ' Timelineele /adel ', {ID: $target. attr (' Data-id ')}, function (response) {if (false = = = Response.rs
              ) {return Hhjslib.warn (response.message);
              } $ (' #item-con-' + ID). fadeout (' Fast ', function () {$ (this). Remove ();
              });
            $target. PopOver (' destroy ');
          }
          );
        Return
        $target. PopOver (' destroy ');
        $ (' #item-con-' + ID). fadeout (' Fast ', function () {$ (this). Remove ();
      });
    });
  });
  }, Getnewelesortnum:function (heading) {return parseint (This.getmaxsortnum (heading)) + 1;
    }, Getmaxsortnum:function (heading) {var sortnums = [];
    $ ('. ele-sort-' + heading). each (function () {Sortnums.push ($ (this). Val ());
    }); Sortnums = Sortnums.sort (function (A, b) {if (A = = = B) {return 0;
      } if (typeof a = = typeof b) {return a > B -1:1; Return typeof a > typeof B?
    -1:1;
 
    }); return sortnums[0] = = null?
  0:sortnums[0];
  }, Binduploadeleimagebtn:function () {this.binduploadmodal (' a.btn-upload ');
    }, Binduploadeleaudiobtn:function (DOM) {var self = this;
      $ (DOM). Click (function () {var $this = $ (this); var t = HHJsLib.modal.confirm (' Upload audio ', ' <div class= ' text-center ' > ' + ' <p> browse your computer, from Select an audio file. </p> ' + ' <div class= "Btn-box btn btn-blue" > ' + ' <div id= "upload-btn" > Upload from PC </div>
      ' + ' </div> ' + ' </div> ');
        var uploader = Hjzuploader.createaudio (' #upload-btn ', {formData: {model: ' Timeline '},
    }, function (response) {if (false = = response.rs) {self.setdemoboxinit ($this);        Return Hhjslib.warn (Response.message);
          Self.setdemoaudioinfo ($this, response.data);
        $ (' #dialog-box-' + t). Modal (' hide ');
      }
      );
      Uploader.on (' uploadprogress ', function (file) {self.setdemoboxloading ($this);
 
      });
    return uploader;
  }); }, Setdemoaudioinfo:function ($target, data) {var audiohtml = ' <audio controls= ' controls ' ><source src= '
    + SiteURL + data.src + '/></audio> ';
    $ ($target. attr (' Data-demo-box ')). HTML (audiohtml). Show ();
  $ ($target. attr (' Data-field ')). attr (' Data-id ', data.id). attr (' data-src ', data.src);
    }, Binduploadmodal:function (DOM) {var self = this;
      $ (DOM). Unbind (' click '). Click (function () {var $this = $ (this); var t = HHJsLib.modal.confirm (' Upload picture ', ' <div class= ' text-center ' > ' + ' <p> browse your computer for pictures , select one from. </p> ' + ' <div class= ' btn-box btn btn-blue ' > ' + ' <div id= ' upLoad-btn "> Upload from pc </div> ' + ' </div> ' + ' </div> ');
        var uploader = hjzuploader.createimage (' #upload-btn ', {formData: {model: ' Timeline '}
            }, function (response) {if (false = = response.rs) {self.setdemoboxinit ($this);
          Return Hhjslib.warn (Response.message); var imghtml = '  ';
          $ ($this. attr (' Data-demo-box ')). HTML (imghtml). Show ();
          $ ($this. attr (' Data-field ')). Val (response.data.id). attr (' data-src ', response.data.src);
        $ (' #dialog-box-' + t). Modal (' hide ');
      }
      );
      Uploader.on (' uploadprogress ', function (file) {self.setdemoboxloading ($this);
      });
 
      SELF.BINDDELIMAGEBTN (' a.btn-del-image ');
    return uploader;
  }); }, Bindpreviewbtn:function () {var self = thiS
        $ (' #edit-btn, #preview-btn '). Click (function () {try{self.verifybaseinfo ();
        Self.verifyeleinfo ();
        Self.verifyconclusioninfo ();
      $ (' #timeline-form '). Submit ();
      }catch (e) {return Hhjslib.warn (e);
  }
    });
    }, Verifybaseinfo:function () {hhjslib.isemptybydom (' #image-path ', ' timeline larger picture ');
    Hhjslib.isemptybydom (' #cover ', ' timeline cover ');
    Hhjslib.isemptybydom (' #name ', ' title ');
  Hhjslib.isemptybydom (' #description ', ' description ');
    }, Verifyeleinfo:function () {this.verifyheadereleinfo ();
    This.verifytexteleinfo ();
    This.verifyimageeleinfo ();
    This.verifyvideoeleinfo ();
    This.verifyaudioeleinfo ();
    This.verifyquestioneleinfo ();
  This.verifyknoweleinfo (); }, Verifyheadereleinfo:function () {$ (' div.item-heading-box '). each (function () {Hhjslib.isempty (.      
    ' textarea '). Val (), ' headline content ');
  }); }, Verifytexteleinfo:function () {$ (' div.item-text-box '). each (function () {HHJslib.isemptybydom (' #ele-text-' + $ (this). attr (' Data-id '), ' text content element ');
  }); }, Verifyimageeleinfo:function () {$ (' div.item-image-box '). each (function () {hhjslib.isemptybydom (' #ele-image
      -hash-' + $ (this). attr (' Data-id '), ' picture Address ');
    Hhjslib.isemptybydom (' #ele-image-content-' + $ (this). attr (' Data-id '), ' picture Introduction ');
  }); }, Verifyvideoeleinfo:function () {$ (' div.item-video-box '). each (function () {hhjslib.isemptybydom (' #ele-video
      -hash-' + $ (this). attr (' Data-id '), ' video address ');
    Hhjslib.isemptybydom (' #ele-video-content-' + $ (this). attr (' Data-id '), ' video intro ');
  }); }, Verifyaudioeleinfo:function () {$ (' div.item-audio-box '). each (function () {hhjslib.isemptybydom (' #ele-audio
      -hash-' + $ (this). attr (' Data-id '), ' audio address ');
    Hhjslib.isemptybydom (' #ele-audio-content-' + $ (this). attr (' Data-id '), ' audio intro ');
  }); }, Verifyquestioneleinfo:function () {$ (' div.item-question-box '). each (function () {hhjslib.isemptybydom (' #ele -question-conteNt-' + $ (this). attr (' Data-id '), ' question content ');
      Hhjslib.isemptybydom (' #ele-question-extend-' + $ (this). attr (' Data-id '), ' explanation of the answer ');
      Hhjslib.isempty (Answerlen, ' question answer '); $ (' #answer-box-' + $ (this). attr (' Data-id '). "(' textarea '). each (the function () {Hhjslib.isempty ($ (this). Val (), ' question answer
      Case ");
    });
  }); }, Verifyknoweleinfo:function () {$ (' div.item-know-box '). each (function () {hhjslib.isemptybydom (' #ele-know-h
      ash-' + $ (this). attr (' Data-id '), ' know picture address ');
    Hhjslib.isemptybydom (' #ele-know-content-' + $ (this). attr (' Data-id '), ' know the introduction ');
  });
    Verifyconclusioninfo:function () {var length = $ (' #conclusion-box div.item-con '). length;
    Hhjslib.isempty (length, ' summary ');
      $ (' #conclusion-box div.item-con '). each (the function () {var dataid = $ (this). attr (' Data-id ');
      Hhjslib.isemptybydom (' #ele-con-hash-' + dataid, ' summary picture ');
    Hhjslib.isemptybydom (' #ele-con-content-' + dataid, ' summary details ');
  }); }, Binddownloadeleaudiobtn:function() {var self = this;
      $ (' a.download-audio-btn '). Click (function () {var $this = $ (this);
        try{hhjslib.isemptybydom ("#item-audio-upload-hash-" + $this. attr (' Data-id '), ' download address ');
        var url = $ ("#item-audio-upload-hash-" + $this. attr (' Data-id ')). Val (); if (' MP3 '!= url.substring (Url.lastindexof ('. ') + 1). toLowerCase ()) {return Hhjslib.warn (' format not supported, must be MP3 format!
        '); var t = HHJsLib.modal.info (' Download audio ', ' <p class= ' text-center ' > downloading audio file, please wait ... <p&
        gt; '
        );
        Self.setdemoboxloading ($this); 
          $.getjson (SiteURL + ' index.php/public/resource/adownload ', {url:encodeuricomponent (URL)},
              Function (response) {if (false = = response.rs) {self.setdemoboxinit ($this);
            Return Hhjslib.warn (Response.message);
            } $ (' #dialog-box-' + t). Modal (' hide '); Self.setdemoaudioinfo ($this, Response.data);
      }
        );
      catch (e) {return Hhjslib.warn (e);
  }
    });
    }, Setdemoboxloading:function ($target) {$ ($target. attr (' Data-box ')). Removeclass (' No-file '). addclass (' uploaded ');
  $ ($target. attr (' Data-file-box ')). html (');
    }, Setdemoboxinit:function ($target) {$ ($target. attr (' Data-box ')). Removeclass (' uploaded '). addclass (' No-file ');
  $ ($target. attr (' Data-file-box ')). html (');
      }, Bindsetpreviewvideo:function () {$ (' input.ele-video '). Change (function () {var url = $ (this). Val (); if (URL!= ') {if (' swf '!= url.substring (Url.lastindexof ('. ') +1). toLowerCase ()) {return Hhjslib.wa RN (' Video address is not legal, please enter a valid online watch Flash address!
        '); var previewhtml = ' <embed src= ' + URL + ' "quality=" High "width=" 495 "height=" "align=" Middle "allowscr Iptaccess= "Always" allowfullscreen= "true" mode= "Transparent" type= "Application/x-shockwave-flash" ></embed
        > '; $ ($ (this). attr (' Data-demo-box ')). HTML (previewhtml);
  }
    });
  }, Binddelelebtnformedit:function () {this.binddeluploadimgbtn ();
   }, Gettimestamp:function () {return (new Date ()). GetTime (); }
});

The above is the full content of this article to share, hope to be able to learn JavaScript to help you.