http://www.sufeinet.com/plugin.php?id=keke_group

苏飞论坛

 找回密码
 马上注册

QQ登录

只需一步,快速开始

分布式系统框架(V2.0) 轻松承载百亿数据,千万流量!讨论专区 - 源码下载 - 官方教程

HttpHelper爬虫框架(V2.7-含.netcore) HttpHelper官方出品,爬虫框架讨论区 - 源码下载 - 在线测试和代码生成

HttpHelper爬虫类(V2.0) 开源的爬虫类,支持多种模式和属性 源码 - 代码生成器 - 讨论区 - 教程- 例子

查看: 3607|回复: 1
打印 上一主题 下一主题

[Asp.Net] e.target.files[0]详情与原因全套参数

[复制链接]
跳转到指定楼层
楼主
发表于 2019-4-27 17:15:08 | 只看该作者 回帖奖励 |正序浏览 |阅读模式
   
因为我现在拿到的一个功能是上传时过滤掉很大尺寸的图片,所以需要来拿到上传时选择图片的size,所以有了这篇博文
不多说 上代码

$('input').change(function(e){
console.log(e)==>得到的是什么呢

  得到的是:下面这些
[C#] 纯文本查看 复制代码
altKey:undefined
bubbles:true
cancelable:false
ctrlKey:undefined
currentTarget:input
data:null
delegateTarget:input
detail:undefined
eventPhase:2
handleObj:Object
isDefaultPrevented:h()
jQuery22007808826687871413:true
metaKey:undefined
originalEvent:Event
relatedTarget:undefined
shiftKey:undefined
target:input
timeStamp:3956.0400000000004
type:"change"
view:undefined
which:undefined
__proto__:Object

console.log(e.target)又会得到什么呢?

  得到的是input对象<input type="file" multiple="multiple" style="top: 91px; left: 44px; position: absolute; opacity: 0; z-index: 1000;">

console.log(e.target.files)呢,得到的又是什么呢?

  得到的是一串filelist
[C#] 纯文本查看 复制代码
FileList
length:0
__proto__:FileList

console.log(e.target.files[0])又能得到什么呢

  得到的是第一张input选择的图片的一些参数,得到的这些参数可以根据自己的需要提取,比如我现在需要的是size参数,e.target.files[0].size就可以拿到了,得到的单位是b哈
[C#] 纯文本查看 复制代码
File
lastModified:1478486422000
lastModifiedDate:Mon Nov 07 2016 10:40:22 GMT+0800 (CST)
name:"222.jpg"
size:124996
type:"image/jpeg"
webkitRelativePath:""
__proto__:File
})
继续加油,一步一步&#127385;



1. 开通SVIP会员,免费下载本站所有源码,不限次数据,不限时间
2. 加官方QQ群,加官方微信群获取更多资源和帮助
3. 找站长苏飞做网站、商城、CRM、小程序、App、爬虫相关、项目外包等点这里
沙发
 楼主| 发表于 2019-4-27 17:16:01 | 只看该作者
验证图片大小,以及是否是正确的格式
[C#] 纯文本查看 复制代码
 var rw = new Vue({
            el: '#list',
            data() {
                return {
                    imgList: [],
                    size: 0,
                    extList: ["bmp", "gif", "jpeg", "png", "jpg"]
                }
            },
            methods: {
                fileClick() {
                    document.getElementById('upload_file').click()
                },
                fileChange(el) {
                    if (!el.target.files[0].size) return;
                    this.fileList(el.target.files);
                    el.target.value = ''
                },
                fileList(files) {
                    for (let i = 0; i < files.length; i++) {
                        this.fileAdd(files[i]);
                    }
                },
                fileAdd(file) {
                    if (rw.imgList.length > 299) {
                        return alert("超出图片数量最大限制!!!");
                    }
                    //验证是否为图片格式
                    if (rw.extList.indexOf(file.name.split('.')[1].toLowerCase()) < 1) {
                        return alert("不是支持的图片格式!!!");
                    }
                    this.size = this.size + file.size;//总大小
                    let reader = new FileReader();
                    reader.vue = this;
                    reader.readAsDataURL(file);
                    reader.onload = function () {
                        file.src = this.result;
                        this.vue.imgList.push({
                            file
                        });
                    }
                },
                fileDel(index) {
                    this.size = this.size - this.imgList[index].file.size;//总大小
                    this.imgList.splice(index, 1);
                },
                bytesToSize(bytes) {
                    if (bytes === 0) return '0 B';
                    let k = 1024, // or 1024
                        sizes = ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'],
                        i = Math.floor(Math.log(bytes) / Math.log(k));
                    return (bytes / Math.pow(k, i)).toPrecision(3) + ' ' + sizes[i];
                },
                dragenter(el) {
                    el.stopPropagation();
                    el.preventDefault();
                },
                dragover(el) {
                    el.stopPropagation();
                    el.preventDefault();
                },
                drop(el) {
                    el.stopPropagation();
                    el.preventDefault();
                    this.fileList(el.dataTransfer.files);
                }
            }
        })
您需要登录后才可以回帖 登录 | 马上注册

本版积分规则

QQ|手机版|小黑屋|手机版|联系我们|关于我们|广告合作|苏飞论坛 ( 豫ICP备18043678号-2)

GMT+8, 2024-12-19 04:46

© 2014-2021

快速回复 返回顶部 返回列表