JavaScript模拟出一个input用于添加本地文件

     $('#picture').click(function () {var fileTypes = ['.jpg', '.png', '.jpeg', '.gif', '.bmp'];//模拟出一个input用于添加本地文件var input = document.createElement('input');input.setAttribute('type', 'file');input.setAttribute('accept', fileTypes.join(','));//上传一张把这句去掉input.setAttribute('multiple', 'multiple');input.click();input.onchange = function () {//上传一张 var files = this.files[0];var files = this.files;//上传一张把遍历去掉即可$.each(files, function (index, item) {//js中返回位于String对象中指定位置的子字符串并转换为小写.var extension = '.' + item.name.split('.').pop().toLowerCase();//判断数组中是否包文件格式var existType = $.inArray(extension, fileTypes);//不存在提示信息if (existType == -1) {layer.msg('不支持上传' + extension + '格式', { icon: 0, time: 2000 });return;}//生成文件读取内置对象let fileReader = new FileReader();//等待文件阅读器读取完毕再渲染图片fileReader.onload = function () {//回显图片$('#bTalkWords').append('<img src="' + this.result + '" data-index="' + index + '"/> ');}//页面添加元素 这是一个异步执行的过程，所以需要onload回调函数执行读取数据后的操作fileReader.readAsDataURL(item);});}//失去鼠标焦点$(this).blur();});

JavaScript模拟出一个input用于添加本地文件相关推荐

JavaScript 弹出一个可移动的框
<script language="javascript"> /*Title:JavaScript 弹出一个可移动的框 *Author: Alvin *Date: ...
瑞恩面试编程题：找出一个目录下所有的文件
package jp.co.sanx.pos.event; import java.io.File; import java.io.IOException; /*** 找出一个目录下所有的文件*/ p ...
使用JavaScript实现出一个简单的购物车
利用了JavaScript进行加减运算对商品进了了一个简单的添加,删除,以及多个商品之间的价钱叠加这样的效果. 话不多说,直接上代码: Html: <h1>商店</h1>< ...
HTML5 + Javascript 写出一个钢琴
首发:GitHubClub 原文:juejin.im/post/6879708939190009869 学生时代的我们如果有像郎朗一样的琴技,想必追起女生会非常的容易,但在以前,一架钢琴对普通家庭来说 ...
本地服务器的音乐如何才能播放视频文件夹,mx播放器如何添加本地文件添加本地文件设置方法...
更换播放器皮肤/主题颜色在这个版本中主题颜色的设置十分丰富不再拘泥于原来的黑白二色点击"设置"选择"列表"项修改主题,选择一种自己喜欢的颜色现在有十 ...
qpushbutton 添加本地文件图标_1.PyQt5实现多文件调用以及UI和逻辑分离
作为一个使用C++开发QT五年的"老"程序猿,总觉得使用C++开发GUI,是一个很费时费力或者说没有"钱"途的事情,因为现在有大量的轻量化的编程语言可以做很绚丽 ...
Python+花生壳搭建一个外网访问本地文件的服务器
1.首先电脑要安装python并且配置环境变量 (安装Python时勾选 Add Python to PATH,可以自动配置环境变量) 官网:Python.org 2.安装完成后,按下 [win+R ...
javascript弹出一个弹窗
源码: function nalerte(setting){ random = Math.random()*1000 str = `<div style="positi ...
js/jq input file获取本地文件路径将要上传图片显示到页面
<div class="ge_pic_icon_Infor"><img src="images/moren.jpg"/> </di ...
uniapp 添加本地文件日志并增加防抖（防止重复写入被覆盖）
base64.js // // THIS FILE IS AUTOMATICALLY GENERATED! DO NOT EDIT BY HAND! // ;(function(global, fac ...

JavaScript模拟出一个input用于添加本地文件

JavaScript模拟出一个input用于添加本地文件相关推荐

最新文章

热门文章