Home>

Simple implementation to limit the number of uploadify uploads

function deleteurl () {
   $("body"). on ("click", ". img-wrap .mask span", function (event) {
    event.stoppropagation ();
    var qs=$("#file_upload-queue>div");//All queues
    var id=qs.eq (2) .attr ("id");//Get the id of the third queue
    $("#uploadtowedaccredit"). uploadify ("cancel", id);//That's it,Will automatically reset the number of queues and delete dom objects, can not directly qs.eq (2) .remove (), invalid
    /*
    if (! window.confirm ("Are you sure i want to delete the attachment?")) {
      return;
    }
    var imgurl=$(this) .parents (". img-wrap"). find ("img"). attr ("src");
    deleteimage (imgurl);
    $(this) .parents (". img-wrap"). remove ();
    * /
  });
};
<li>
  <span><em>*</em>Power of Attorney:</span>
  <div>
    <input type="file" name="uploadtowedaccredit" />
  </div>
  <span><em></em>Please upload the attachment,Upload up to ${towedaccreditpicmax} pictures</span>
  <div></div>
</li>
//Upload the power of attorney
function uploadtowedaccreditinit () {
   $("#uploadtowedaccredit"). uploadify ({
    "hidebutton":"true",    "preventcaching":"true",    "checkexisting":"true",    "swf":swf,    "uploader":uploadimg,    "debug":false,    "multi":true,    "method":"post",    "preventcaching":true,    "removecompleted":true,    "removetimeout":10,    "requeueerrors":true,    "successtimeout":30,    "uploadlimit":${towedaccreditpicmax},    "fileobjname":"filedata",    //Maximum limit for a single picture
    "filesizelimit":"1024kb",    "filetypedesc":"image files",    //Only upload pictures in jpg format
    "filetypeexts":"* .jpg;*. png",    "height":24,    "width":73,    "buttontext":"Upload attachment",    "auto":true,    "buttonclass":"uploada btn-fff-24",    "onswfready":function () {
    },    "oninit":function () {
      //$("#file_upload-button"). css ("width", "100");
     },    //Select the picture to complete
    "onselect":function () {
    },    //cancel upload
    "oncancel":function (file) {
    },    "oncheck":function (event, data, key) {
    },    //Start upload
    "onuploadstart":function (file) {
      $(". uploadify-queue"). html ("");
    },    //During upload
    "onuploadprogress":function (file, bytesuploaded, bytestotal, totalbytesuploaded, totalbytestotal) {
      $(". uploadify-queue"). html ("");
      $("#uploadtowedaccreditlinktip"). html ("<em></em>Uploading ...");
    },    //upload completed
    "onuploadcomplete":function (file) {
        $(". uploadify-queue"). html ("");
        $("#uploadtowedaccreditlinktip"). html ("<em></em>upload was successful,Pending submission ");
    },    //Upload successful
    "onuploadsuccess":function (file, data, response) {
      var obj=eval ("(" + data + ")");
        var result=obj.result;
        if (result == "true") {
          var filename=obj.filename;
          $(". uploadify-queue"). html ("");
          $("#towedaccreditdiv"). append ("<div><img width =" 112 "height =" 84 "src =" "+ filename +" "><div><em>;<span></span></div></div>");
        }
    },    //Upload failed //The format of the attachment is incorrect,Please upload files in jpg, bmp, png format.
No more than 3mb
    "onuploaderror":function (file, errorcode, errormsg, errorstring) {
      switch (errorcode) {
        case -100:
          alert ("The number of uploaded files has exceeded the system limit" + $("#uploadtowedaccredit"). uploadify ("settings", "queuesizelimit") + "files!");
          break;
        case -110:
          alert ("file [" + file.name + "]" + $("#uploadtowedaccredit"). uploadify ("settings", "filesizelimit") + "size!");
          break;
        case -120:
          alert ("File [" + file.name + "] is abnormally large!");
          break;
        case -130:
          alert ("File [" + file.name + "] is of the wrong type!");
          break;
      }
    },    //Upload failed //The format of the attachment is incorrect,Please upload files in jpg, bmp, png format.
No more than 3mb
    "onselecterror":function (file, errorcode, errormsg) {
      var msgtext="Upload failed \ n";
      switch (errorcode) {
        case swfupload.queue_error.queue_limit_exceeded:
          var towedaccreditdivlen=$("#towedaccreditdiv"). children (). length;
          msgtext +="Upload at a time" + $("#uploadtowedaccredit"). uploadify ("settings", "uploadlimit") + "files";
          break;
        case swfupload.queue_error.file_exceeds_size_limit:
          msgtext +="File size exceeds limit (" + $("#uploadtowedaccredit"). uploadify ("settings", "filesizelimit") + ")";
          break;
        case swfupload.queue_error.zero_byte_file:
          msgtext +="File size is 0";
          break;
        case swfupload.queue_error.invalid_filetype:
          msgtext +="The file format is incorrect.
Only "+ $(" #uploadtowedaccredit "). Uploadify (" settings "," filetypeexts ");
          break;
        default:
          msgtext +="error code:" + errorcode + "\ n" + errormsg;
      }
      alert (msgtext);
    }
  });
  //Determine whether the user has flash installed
 var obj=$("#uploadtowedaccredit"). children (). eq (0);
 if (obj.attr ("type")!="application/x-shockwave-flash") {
    alert ("The system has detected that your browser does not have the flash plugin installed. In order for you to upload pictures normally,It is recommended that you install flash ");
    return;
  }
  $("#uploadtowedaccredit"). css ("float", "left");
};

In addition, we attach jquery + uploadify to upload multiple files.

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<title>php jquery uploadify multiple file upload</title>
<link href="css/default.css" rel="stylesheet" type="text/css" />
<link href="css/uploadify.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="js/swfobject.js"></script>
<script type="text/javascript" src="js/jquery.uploadify.v2.1.0.min.js"></script>
<script type="text/javascript">
$(document) .ready (function () {
$("#Fileinput2 ″). Uploadify ({
"uploader":"js/uploadify.swf", //the required flash file
"cancelimg":"cancel.png", //a single canceled upload image
"script":"js/uploadify.php", //Uploading program
"folder":"uploads", //The upload directory on the server
//"auto":true, //auto upload
"multi":true, //multiple file uploads
//"checkscript":"js/check.php", //Verification, server-side
"displaydata":"speed", //How the progress bar is displayed
//"filedesc":"image (*. jpg;*. gif;*. png)", //The file type description of the dialog box
//"fileext":"* .jpg;*. jpeg;*. gif;*. png", //Uploadable file types
//"sizelimit":999999, //limit the size of the uploaded file
//"simuploadlimit":3, //Concurrent upload data
//"queuesizelimit":5, //Number of files that can be uploaded
//"buttontext":"File upload", //Replace text on the button with text
"buttonimg":"css/images/browsebtn.png", //Replace upload button
"width":80, //buttonimg size
"height":24, //
"rollover":true, //button is transformed
oncomplete:function (evt, queueid, fileobj, response, data) {
//alert ("successfully uploaded:" + fileobj.filepath);
//alert (response);
getresult (response);//Get the uploaded file path
}
//onerror:function (errorobj) {
//alert (errorobj.info + "" + errorobj.type);
//}
});
});
</script>
<script type="text/javascript">
function getresult (content) {
//Dynamically generate text from the uploaded image to save the path
var board=document.getelementbyid ("divtxt");
board.style.display="";
var newinput=document.createelement ("input");
newinput.type="text";
newinput.size="45 ″;
newinput.name="myfilepath []";
var obj=board.appendchild (newinput);
var br=document.createelement ("br");
board.appendchild (br);
obj.value=content;
}
</script>
</head>
<body>
<fieldset style="border:1px solid #cdcdcd;padding:8px;padding-bottom:0px;margin:8px 0 ″>
<legend><strong>Multi-file upload</strong></legend>
<div>
<input id="fileinput2 ″ name =" fileinput2 ″ type="file" />
<input type="button" value="OK upload" onclick="javascript:$(" #fileinput2 ′). Uploadifyupload ();">
||<a href="javascript:$(" #fileinput2 ′). Uploadifyclearqueue ();">Clear upload list</a></div>
<p></p>
</fieldset>
<form name="form2 ″ method=post action =" db.php ">
 <div id="divtxt" style="display:none"><span style="color:red"><strong>The pictures that have been uploaded are:</strong></span><br></div><br>
<input type="submit" value="submit">
</form>
</body>
</html>
  • Previous Javascript entry tutorial basics
  • Next JavaScript code implementation prohibits right click, select, paste, shift, ctrl, alt