注册 登录 充值会员 退出
网站、APP、小程序等定制开发,联系QQ 1206995177 毕业设计 java源码 PHP源码

充值

jQuery+svg多张图片同时上传预览代码

作者/代码整理:  (源码已亲测,不会安装的可以向QQ1915635791要安装视频教程) 发布日期:2022-12-24
jQuery+svg多张图片同时上传预览代码
jQuery+svg多张图片同时上传预览代码,不过选择图片的时候只能一张张的选择,还可以对选择好的图片进行删除操作。


js代码

<script type="text/javascript" src="js/svg.js"></script>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript">
  //选择图片
  var loadImg = function(obj){
    $(obj).parent().find(".upload_input").click();
  }
  //删除
  var deleteImg = function(obj){
    $(obj).parent().find('input').val('');
    $(obj).parent().find('.preview').html('');
    $(obj).hide();
  }
</script> 

<!-- 预览 --> 
<script type="text/javascript">
function preview(file) {
  var prevDiv = $(file).parent().find('.preview');
  if (file.files && file.files[0]) {
    var reader = new FileReader();
    reader.onload = function(evt) {
      prevDiv.html('<img src="' + evt.target.result + '" />');
    }
    reader.readAsDataURL(file.files[0]);
  } else {//IE
    prevDiv.html('<div class="img" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale,src=\'' + file.value + '\'"></div>');
  }
  $(file).parent().find('.delete').show();
}
</script>