您现在的位置:首页 >> 前端 >> 内容

js对象爆炸的简单示例

时间:2017/2/9 11:11:00 点击:

  核心提示:h1文件上传与对象爆炸的简单案例/h1script var id = 0; startUpload = function( uploadType, files ){for( var i = 0, fi...
<h1>文件上传与对象爆炸的简单案例</h1>
<script>
    
   var id = 0;
   startUpload = function( uploadType, files ){
      for( var i = 0, file; file = files[ i++ ]; ){
         var uploadObj = new Upload( uploadType, file.fileName, file.fileSize );
         uploadObj.init( id++ );
      }
   };
    
   var Upload = function( uploadType, fileName, fileSize ){
       this.uploadType = uploadType;
       this.fileName = fileName;
       this.fileSize = fileSize;
       this.dom = null;
   };
    
   Upload.prototype.init = function( id ){
      var that = this;
      this.id = id;
      this.dom = document.createElement("p");
      this.dom.innerHTML = 
                    '<span>文件名称:' + this.fileName + ', 文件大小:' + this.fileSize + '</span>' +
                    '<button class="delFile">删除</button>';
      this.dom.querySelector( '.delFile' ).onclick = function(){
         that.delFile();
      };
      document.body.appendChild( this.dom );
   };
    
   Upload.prototype.delFile = function(){
      if( this.fileSize < 3000 ){
         return this.dom.parentNode.removeChild( this.dom );
      };
       
      if( confirm( "确定要删除该文件么?" + this.fileName )){
         return this.dom.parentNode.removeChild( this.dom );
      }
   };
    
   startUpload( "plugin", [
      {
         fileName: "1.txt",
         fileSize: 1000
      },
      {
         fileName: "2.txt",
         fileSize: 2000
      },
      {
         fileName: "3.txt",
         fileSize: 5000
      }
   ])
</script>

 

Tags:JS S对 对象 象爆 
作者:网络 来源:Hi_xiexial
  • 上一篇:文本样式
  • 下一篇:创建可读性良好的CSS