插件集合

16 Aug 2013, by

上传插件

简单jquery实现

JS:
  $('.in_btn').click(function(){
    $('.afile').click();
  });

  $('.afile').change(function(){
    var objUrl = getObjectURL(this.files[0]);

    alert(objUrl);

    if(this.files[0].size/1024>3720)
    {
      alertify.log("图片太大啦");
    // }else if(!/.(gif|jpg|jpeg|png|gif|jpg|png)$/.test(this.files[0]))
    // {
    //   alert(this.files[0].value);
    //   alertify.log('上传的不是图片!');
    }else{
      $('.imgsrc').attr("src", objUrl);
      $('.imgsrc').attr("width", "100px");
      $('.imgsrc').attr("height", "100px");
    };
  });

  function getObjectURL(file) {
    var url = null ;
    if (window.createObjectURL!=undefined) {
      url = window.createObjectURL(file);
    } else if (window.URL!=undefined) {
      url = window.URL.createObjectURL(file);
    } else if (window.webkitURL!=undefined) {
      url = window.webkitURL.createObjectURL(file);
    }
    return url ;
  };


HTML:
<span><img class="imgsrc" src="" /></span>
<div><a class="in_btn button tiny" href="javascript:;">图片上传</a><input class="afile" type="file" name="comment[attachment]"/></div>

前端框架