Rumah > hujung hadapan web > tutorial js > Javascript melaksanakan format muat naik muat naik dan kemahiran limit_javascript nombor

Javascript melaksanakan format muat naik muat naik dan kemahiran limit_javascript nombor

WBOY
Lepaskan: 2016-05-16 15:30:37
asal
1246 orang telah melayarinya

Artikel ini berkongsi dengan anda kod utama untuk melaksanakan format muat naik muat naik dan had nombor dalam javascript. Saya harap anda akan mengkajinya dengan teliti.

Kod utama satu:

function deleteUrl(){
   $("body").on("click",".img-wrap .mask span",function(event){
    event.stopPropagation();
          
    var qs=$('#file_upload-queue>div');//所有的队列
    var id=qs.eq(2).attr('id');//得到第三个队列的id
    $('#uploadTowedAccredit').uploadify('cancel',id);//这样就行了,会自动重置队列数量和删除dom对象,不能直接qs.eq(2).remove(),无效
      
    /*
    if(!window.confirm("您确定删除附件?")){
      return;
    }
    var imgUrl=$(this).parents(".img-wrap").find("img").attr("src");
    deleteImage(imgUrl);
    $(this).parents(".img-wrap").remove();
    */
  });
};
Salin selepas log masuk

Kod kunci dua:

<li class="blockli clearfix" style="padding-bottom: 5px;">
  <span class="left-name"><em class="red-star">*</em>拖机授权委托书:</span>
  <div class="upload-wrap" style="width:100px;">
    <input type="file" name="uploadTowedAccredit" id="uploadTowedAccredit" class="filetext"/>
  </div>
  <span id="uploadTowedAccreditLinkTip" class="warn-tips"><em></em>请上传附件,最多上传${towedAccreditPicMax} 张</span>
  <div id="towedAccreditDiv" class="up-img-list clearfix"></div>
</li>
Salin selepas log masuk

Kod kunci tiga:

// 上传拖机授权委托书
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',
    //单张图片最大限制
    'fileSizeLimit' : '1024KB',
    'fileTypeDesc' : 'Image Files',
    //仅限上传jpg格式图片
    'fileTypeExts' : '*.jpg;*.png',
    'height': 24,
    'width':73,
    'buttonText' : '上传附件',
    'auto': true,
    'buttonClass':'uploada btn-fff-24',
   
    'onSWFReady' : function() {
    },
     
    'onInit':function(){
      // $("#file_upload-button").css("width","100");
     },
         
    //选择图片完成
    'onSelect' : function() {
 
    },
     
    //取消上传
    'onCancel' : function(file) {
    },
    'onCheck': function(event,data,key) {
    },
    //开始上传
    'onUploadStart' : function(file) {
      $('.uploadify-queue').html('');
    },
     
    //上传过程中
    'onUploadProgress' : function(file, bytesUploaded, bytesTotal, totalBytesUploaded, totalBytesTotal) {
      $('.uploadify-queue').html('');
      $("#uploadTowedAccreditLinkTip").html('<em></em>上传中...');
    },
     
    //上传完成
    'onUploadComplete' : function(file) {
        $('.uploadify-queue').html('');
        $("#uploadTowedAccreditLinkTip").html('<em></em>上传成功,待提交');
    },
     
    //上传成功
    '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 class='img-wrap'><img width='112' height='84' alt='' src='"+filename+"'><div class='mask'><em></em><span></span></div></div>");
        }
    },
     
    //上传失败 //附件格式不正确,请上传JPG、BMP、PNG格式文件,大小不超过3MB
    'onUploadError' : function(file, errorCode, errorMsg, errorString) {
      switch(errorCode) {
        case -100:
          alert("上传的文件数量已经超出系统限制的"+$('#uploadTowedAccredit').uploadify('settings','queueSizeLimit')+"个文件!");
          break;
        case -110:
          alert("文件 ["+file.name+"] 大小超出系统限制的"+$('#uploadTowedAccredit').uploadify('settings','fileSizeLimit')+"大小!");
          break;
        case -120:
          alert("文件 ["+file.name+"] 大小异常!");
          break;
        case -130:
          alert("文件 ["+file.name+"] 类型不正确!");
          break;
      }
    },
    //上传失败 //附件格式不正确,请上传JPG、BMP、PNG格式文件,大小不超过3MB
    'onSelectError' : function(file, errorCode, errorMsg) { 
      var msgText = "上传失败\n"; 
      switch (errorCode) { 
        case SWFUpload.QUEUE_ERROR.QUEUE_LIMIT_EXCEEDED: 
          var towedAccreditDivLen = $("#towedAccreditDiv").children().length;
          msgText += "每次最多上传 " + $('#uploadTowedAccredit').uploadify('settings','uploadLimit') + "个文件"; 
          break; 
        case SWFUpload.QUEUE_ERROR.FILE_EXCEEDS_SIZE_LIMIT: 
          msgText += "文件大小超过限制( " + $('#uploadTowedAccredit').uploadify('settings','fileSizeLimit') + " )"; 
          break; 
        case SWFUpload.QUEUE_ERROR.ZERO_BYTE_FILE: 
          msgText += "文件大小为0"; 
          break; 
        case SWFUpload.QUEUE_ERROR.INVALID_FILETYPE: 
          msgText += "文件格式不正确,仅限 " + $('#uploadTowedAccredit').uploadify('settings','fileTypeExts'); 
          break; 
        default: 
          msgText += "错误代码:" + errorCode + "\n" + errorMsg; 
      }
      alert(msgText);
    }
  });
   
  //判断用户是否有安装flash
 var obj = $("#uploadTowedAccredit").children().eq(0);
 if(obj.attr('type')!= "application/x-shockwave-flash"){
    alert('系统检测到您的浏览器没有安装flash插件,为了你能够正常上传图片,建议你安装flash');
    return;
  }
   
  $("#uploadTowedAccredit").css("float","left");
};
Salin selepas log masuk

Bagaimanakah JavaScript mengehadkan format dan bilangan muat naik Uploadify. Saya harap semua orang akan memahami isu ini melalui artikel ini. Saya harap ia benar-benar dapat membantu anda menyelesaikan masalah sekatan nombor muat naik dan format.

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan