<form> <input type="file" name="pic" id="pic" accept="image/gif, image/jpeg" /> </form>

可以接受 GIF 和 JPEG 两种图像

如果不限制图像的格式,可以写为:accept="image/*"。

上传图片大小限制

<input type="file" id="tp" name="tp" onchange="upload(this)" accept="image/*"/>

//限制图片宽高:418 * 282

function upload(){

var myimg = URL.createObjectURL(document.getElementById('tp').files[0]);

var img = new Image();

img.src = myimg;

img.onload = function(){

if(img.width > 425 || img.height > 295){

alert("只能上传小于418x282的图片!");

$(".remove").click();

}

};

};

type=file 上传图片限制 类型和尺寸 方法的更多相关文章

  1. vue <input type="file">上传图片、预览、删除

    使用原生<input type="file">上传图片.预览.删除:multiple实现可上传多张 参数名 类型 说明 fileTypes Array 文件类型, 默认 ...

  2. 一、H5(移动端)前端使用input type=file 上传图片,调用相机和相册

    一.H5(移动端)前端使用input type=file 上传图片,调用相机和相册

  3. input[type=file]上传图片及转为base64码以及预览

    <input type="file" id="imgurl" capture="camera" accept="image/ ...

  4. 前端实现input[type='file']上传图片预览效果

    众所周知JavaScript在设计上处于安全角度考虑,是不允许读写本地文件的(原因请自行百度): 但是在实际项目应用中,经常会使用到上传图片,并且可以让用户直接预览图片.对于此种做法有两种方法可以实现 ...

  5. input type="file"指定文件类型为excel

    指定上传类型为excel:加上accept="application/vnd.ms-excel"即可,只兼容chrome跟ff,不兼容ie <input type=" ...

  6. input[type="file"]上传图片并显示图片

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  7. 关于input type=file上传图片的总结

    最近比较忙,现在来整理一下近期的成果,方便以后再次使用. 关于图片上传的js 和jq jq $("input").change(function () { var $file = ...

  8. 修改input type=file 标签默认样式的简单方法

    <html><head><title></title></head><body><form id="upload ...

  9. input type = file 上传图片转为base64

    项目背景是做图片识别,接口需要上传图片格式为base64格式的,react项目的相关代码: let reader = new FileReader();reader.readAsDataURL(e.t ...

随机推荐

  1. 利用freemarker生成word,word另存为xml文件的标签解析

    http://wenku.baidu.com/link?url=YxTZWVP3ssO-e_Br3LIZVq2xOQnqaSz8gLPiRUDN8NIR_wX2-Z25OqwbVn5kXqGiOFYU ...

  2. C++入门经典-例6.13-指针与二维数组

    1:代码如下: // 6.13.cpp : 定义控制台应用程序的入口点. // #include"stdafx.h" #include<iostream> using ...

  3. ASP.NET postback with JavaScript (UseSubmitBehavior)

    ASP.NET postback with JavaScript Here is a complete solution Entire form tag of the asp.net page < ...

  4. mesh之孔洞检测

    mesh之孔洞检测 图1 检测孔洞点 图2 检测孔洞点 图3 检测孔洞点 图4 细节

  5. java 中的多态

    多态是面向对象的重要特性,简单点说:“一个接口,多种实现”,就是同一种事物表现出的多种形态. 下面利用代码进行简单概述: 实现多态必须要满足三个条件 1必须有继承 2必须重写 3必须父类引用子类对象 ...

  6. 深度学习----现今主流GAN原理总结及对比

    原文地址:https://blog.csdn.net/Sakura55/article/details/81514828 1.GAN 先来看看公式:             GAN网络主要由两个网络构 ...

  7. ffmpeg 视频过度滤镜 gltransition

    ffmpeg 视频过度滤镜 gltransition 上次随笔中提到的 ffmpeg-concat 可以处理视频过度,但是缺点是临时文件超大. 经过查找 ffmpeg 还有 gltransition ...

  8. SQL注入漏洞详解

    目录 SQL注入的分类 判断是否存在SQL注入 一:Boolean盲注 二:union 注入 三:文件读写 四:报错注入 floor报错注入 ExtractValue报错注入 UpdateXml报错注 ...

  9. 6.3.2巴特沃斯(butterworth)低通滤波器

    在本程序中,共有六个自定义函数,分别是: 1. myMagnitude(Mat & complexImg,Mat & magnitudeImage),在该函数中封装了Opencv中的 ...

  10. Platform区分不同平台

    用于区分平台 OS 属性 表示当前的平台类型.只有 ios 与 android 两个值.如可以使用为同一个属性在不同的平台上赋不同的值 const styles = StyleSheet.create ...