jquery.multifile1.js

文件上传

       // Setup dynamic regular expression for extension validation
       // - thanks to John-Paul Bader: http://smyck.de/2006/08/11/javascript-dynamic-regular-expresions/
       if(String(MF.accept).length>1){
        MF.rxAccept = new RegExp('\\.('+(MF.accept?MF.accept:'')+')$','gi');
       };
       
       //===
       
       // Create wrapper to hold our file list
       MF.wrapID = MF.instanceKey+'_wrap'; // Wrapper ID?
       MF.E.wrap('<div id="'+MF.wrapID+'"></div>');
       MF.wrapper = $('#'+MF.wrapID+'');
       
       //===
       
       // MF MUST have a name - default: file1[], file2[], file3[]
       MF.e.name = MF.e.name || 'file'+ group_count +'[]';
       
       //===
       
       // Create a wrapper for the labels
       // * OPERA BUG: NO_MODIFICATION_ALLOWED_ERR ('labels' is a read-only property)
       // this changes allows us to keep the files in the order they were selected
       MF.wrapper.append( '<span id="'+MF.wrapID+'_labels"></span>' );
       MF.labels = $('#'+MF.wrapID+'_labels');
       
       //===
       
       // Bind a new element
       MF.addSlave = function( slave ){
        // Keep track of how many elements have been displayed
        MF.n++;
        // Add reference to master element
        slave.MF = MF;
        // Count slaves
     //   slave.i = slave_count;
        
        // BUG FIX: http://plugins.jquery.com/node/1495
        // Clear identifying properties from clones
      //  if(slave.i>0) slave.id = slave.name = null;
        
        // Define element's ID and name (upload components need this!)
        //slave.id = slave.id || MF.generateID(slave.i);
        
        //slave.name = (slave.name || MF.E.attr('name') || 'file');// + (slave.i>0?slave.i:''); // same name as master element
        // 2008-Apr-29: New customizable naming convention (see url below)
        // http://groups.google.com/group/jquery-dev/browse_frm/thread/765c73e41b34f924#
      /*  slave.name = String(MF.namePattern
         .replace(/\$name/gi,MF.E.attr('name'))
         .replace(/\$id/gi,  MF.E.attr('id'))
         .replace(/\$g/gi,   (group_count>0?group_count:''))
         .replace(/\$i/gi,   (slave_count>0?slave_count:''))
        );*/
        
        // Clear value
        $(slave).val('').attr('value','')[0].value = '';
        
        
        // Remember most recent slave
  //      MF.current = MF.slaves[slave.i] = slave;
        
        // now let's use jQuery
        slave = $(slave);
        
        // Triggered when a file is selected
        $(slave).change(function(){
          
          // Lose focus to stop IE7 firing onchange again
          $(this).blur();
          
          //# Trigger Event! onFileSelect
          if(!MF.trigger('onFileSelect', this, MF)) return false;
          //# End Event!
          var ERROR = '';
        // If we've reached maximum number, disable input slave
        if( (MF.max > 0) && ((MF.n) > (MF.max)) )//{ // MF.n Starts at 1, so subtract 1 to find true count
         ERROR = MF.STRING.most.replace('$file', String(MF.max));
        //};
          //# Retrive value of selected file from element
          var v = String(this.value || ''/*.attr('value)*/);
          
          // check extension
          if(MF.accept){
           if(v!=''){
            if(!v.match(MF.rxAccept)){
             ERROR = MF.STRING.denied.replace('$ext', String(v.match(/\.\w{1,4}$/gi)));
            }
           }
          };
          
          // Disallow duplicates
		  for(var f=0;f<MF.files.length;f++)
		  {
			  if(MF.files[f]!=this&&MF.files[f]!=undefined)
			  {
				  if(MF.files[f]==v)
				  {
					 ERROR = MF.STRING.duplicate.replace('$file', v.match(/[^\/\\]+$/gi));
				  }
			  }
		  };
       /*   for(var f=0;f<MF.slaves.length;f++){
           if(MF.slaves[f]!=this){
            if(MF.slaves[f].value==v){
             ERROR = MF.STRING.duplicate.replace('$file', v.match(/[^\/\\]+$/gi));
            }
           }
          };*/
          // Create a new file input element
          //var newEle = $('<input name="'+(MF.E.attr('name') || '')+'" type="file"/>');
          var newEle = $(MF.clone).clone();// Copy parent attributes - Thanks to Jonas Wagner
          //# Let's remember which input we've generated so
          // we can disable the empty ones before submission
          // See: http://plugins.jquery.com/node/1495
          newEle.addClass('MultiFile');
          // Handle error
          if(ERROR!=''){
            // Handle error
            MF.error(ERROR);
            
            // Clear element value (DOES NOT WORK in some browsers)
            //slave.reset().val('').attr('value', '')[0].value = '';
            
            // 2007-06-24: BUG FIX - Thanks to Adrian Wr骲el <adrian [dot] wrobel [at] gmail.com>
            // Ditch the trouble maker and add a fresh new element
            MF.n--;
            MF.addSlave(newEle[0]);
            slave.parent().prepend(newEle);
            slave.remove();
            return false;
          };
          
		  
		  //保存已选择的文件值到files[]
		  MF.files[MF.n-1]=this.value;
          // Hide this element (NB: display:none is evil!)
          $(this).css({ position:'absolute', top: '-3000px' });
          
          // Add new element to the form
          MF.labels.before(newEle);//.append(newEle);
          
          // Update list
          MF.addToList( this );
          
          // Bind functionality
          MF.addSlave( newEle[0] );
          
          //# Trigger Event! afterFileSelect
          if(!MF.trigger('afterFileSelect', this, MF)) return false;
          //# End Event!
          
        }); // slave.change()
        
       };// MF.addSlave
       // Bind a new element
       
       
       
       // Add a new file to the list
       MF.addToList = function( slave ){
        
        //# Trigger Event! onFileAppend
        if(!MF.trigger('onFileAppend', slave, MF)) return false;
        //# End Event!
        
        // Create label elements
        var
         r = $('<div></div>'),
         v = String(slave.value || ''/*.attr('value)*/),
         a = $('<span class="file" title="'+MF.STRING.selected.replace('$file', v)+'">'+v.match(/[^\/\\]+$/gi)[0]+'</span>'),
         b = $('<a href="#'+MF.wrapID+'">'+MF.STRING.remove+'</a>');
        
        // Insert label
        MF.labels.append(
         r.append('[', b, ']&nbsp;', a)//.prepend(slave.i+': ')
        );
        
        b.click(function(){
         
          //# Trigger Event! onFileRemove
          if(!MF.trigger('onFileRemove', slave, MF)) return false;
          //# End Event!
      //    alert($(slave)[0].value);
          MF.n--;
        //  MF.current.disabled = false;
          
          // Remove element, remove label, point to current
          if(slave.i==0){
           $(MF.current).remove();
           MF.current = slave;
          }
          else{
           $(slave).remove();
          };
          $(this).parent().remove();
          
          // Show most current element again (move into view) and clear selection
          $(MF.current).css({ position:'', top: '' }).reset().val('').attr('value', '')[0].value = '';
         //删除数组中的值
		 MF.files.remove($(slave)[0].value);
          //# Trigger Event! afterFileRemove
          if(!MF.trigger('afterFileRemove', slave, MF)) return false;
          //# End Event!

          
          return false;
        });
        
        //# Trigger Event! afterFileAppend
        if(!MF.trigger('afterFileAppend', slave, MF)) return false;
        //# End Event!
        
       }; // MF.addToList
       // Add element to selected files list
       
       
       
       // Bind functionality to the first element
       if(!MF.MF) MF.addSlave(MF.e, 0);
       
       // Increment control count
       //MF.I++; // using window.MultiFile
   //    MF.n++;
       
    });
    // each element
   
   }
   // MultiFile function
 
 });
 // extend jQuery function library
 
 
 
 /*
  ### Default implementation ###
  The plugin will attach itself to file inputs
  with the class 'multi' when the page loads
 */
 $(function(){ $.MultiFile() });
 
 
 
/*# AVOID COLLISIONS #*/
})(jQuery);
/*# AVOID COLLISIONS #*/