<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<script type="text/javascript" src="jquery-1.11.3.min.js"></script>
<div>
<img style="width: 200px;height:200px;border-radius: 100%" src="https://img2018.cnblogs.com/blog/1195302/201811/1195302-20181128163006342-890300325.jpg"/>
</div>
<input type="file" id="input"/ >
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript">
$("input").change(function(){
var files = document.getElementById('input').files
$("img").attr("src", window.URL.createObjectURL(files[0]));
});
</script>
</body>
</html>
相关推荐
html + js 实现图片上传,压缩,预览及图片压缩后得到Blob对象继续上传问题
先上效果 上传图片后(设置了最多上传3张图片,三张后上传按钮消失) 点击图片放大,可以使用删除和旋转按钮 (旋转功能主要是因为ios手机拍照后上传会有写图片被自动旋转,通过旋转功能可以调正) html页面 需要引入weui.min.css 不然没法渲染样式, 将下面的代码放在需要上传文件的地方就行了,如果不需要图片旋转功能, 可以直接删掉那个div, 改不改js无影...
使用 Blob Url 实现上传预览图片
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Blob Test</title> <script> function handleFile(e) { var ...
基于AI Agent的数据治理实战:从架构设计到企业级落地
数据治理是确保企业数据质量、一致性与安全性的核心实践,其核心原理在于通过规范、流程与技术工具对数据进行全生命周期管理。传统人工治理模式效率低下且难以规模化,而大语言模型(LLM)与智能体(Agent)技术的发展,为数据治理的自动化与智能化带来了突破。通过将自然语言理解、任务规划与工具调用能力相结合,AI Agent能够将治理规则“代码化”与“智能化”,实现从被动响应到主动发现的模式转变。在应用场景上,AI Agent可扮演智能数据专员角色,自动执行元数据问答、数据质量探查、口径对齐等任务,显著提升数据团队效
python爬图一篇过(四)【超·详细】:blob:https类型图片处理
前不久博主在爬取图片的过程中,又遇到了一个新问题: 某个加强后的图片网站图片地址不再是我们熟悉的http(s):// 图片出现了blob:https+地址的格式, 使用requests库访问这个网址,会发现是无法得到图片内容的。 搜索了一番后,这类blob原来全称是二进制大型对象(Binary Large Object),表示一个不可变、原始数据的类文件对象。它的数据可以按文本或二进制的格式进行读取,格式比较灵活,一方面适合实时加载(常常见于视频文件),一方面可以有一定反爬效果。 但破绽也是有的:当
Gradle进阶:4:结合Sonarqube进行代码审查
作为代码质量检查的流行工具,比如Sonarqube能够检查代码的“七宗罪”,跟代码结合起来能够更好地提高代码的质量,这篇文章将会介绍如何结合gradle和sonarqube对代码质量与测试覆盖率进行分析。
保姆级教学:从0搭建微信小程序SpringBoot+Vue(一)
目标:实现一个微信小程序从后端数据库MySQL获取的商品展示页。 框架:后端采用SpringBoot,前端采用Vue,数据库MySQL。 部署工具:IntelliJ IDEA 2024.2专业版+HbuilderX+Node+微信开发者工具,jdk1.8已安装
使用blob实现文件下载和图片预览
学习blob对象的笔记 blob叫做二进制大对象(binary large object)主要是存放二进制的容器。 1 存取文本 存放二进制数据,类似数组size为数据长度,type指定类型 example: var str = 'hello world' var blob = new Blob([str], { type: 'text/plain' }) console.log('blob:', blob) 打印结果: 调用t
SAP FICO - 外币交易实战:汇率类型配置与货币换算率管理
月底关账前的外币评估就像财务人的"期末考",OB59配置就是你的备考方案。最低值原则(Lowest value principle)最保守。它会比较原始汇率与评估日汇率,取不利方向确认损失。适合风险厌恶型企业,我在制造业客户中应用最多。重估法(Revalue only)更反映市场现状。无论盈亏都按最新汇率调整,适合交易性金融资产处理。有个基金公司客户就靠这个方法及时反映了外汇波动收益。最小差异金额(Minimum difference)是防骚扰设置。
在浏览器端对图片进行压缩 & 上传
在浏览器端对图片进行压缩 & 上传 07 SEPTEMBER 2016 on multipart, ImageCompression, Blob, XHR2, Android 4.0, 前端 前言 在移动端,我们经常会有这样的情况发生: 用户在 3G/2G 网络情况下,上传手机拍下的照片在经过上传再下载耗时非常长,流量消耗也不少。 因此我们提出了一个要求:前端先压缩图片,在浏
【华为OD机试真题】439、精准核酸检测 | 机试真题+思路参考+代码解析 (C++、Java、Py、C语言、JS)
题目描述 >为了达到新冠疫情精准防控的需要,为了避免全员核酸检测带来的浪费,需要精准圈定可能被感染的人群现在根据传染病流调以及大数据分析,得到了每个人之间在时间、空间上是否存在轨迹的交叉。现在给定一组确诊人品编号(X1 X2 X3.....n)在所有人当中,找出哪些人票要进行核酸检测,输出需要进行核酸检测的人数。(注意:确诊病例自身不需要再做核酸检) > 需要进行核酸检测的人,是病毒传播链条上的所有人员,即有可能通过确诊病例所能传播到的所有人 例如:A是确诊病例,A和B有接触、B和
LVGL嵌入式GUI工程化架构与多窗口实践
嵌入式GUI开发中,LVGL作为轻量级图形库,其核心价值在于高效渲染与事件驱动机制。理解LVGL的对象树模型、资源管理机制(如RAW图像、静态字体)和屏幕生命周期,是构建稳定界面的基础。结合FreeRTOS等实时操作系统,可实现低功耗、高响应的交互体验。典型应用场景包括智能电表、HMI人机界面、工业控制面板等对内存敏感、需长期运行的设备。本文以微信式多窗口架构为范例,深入解析LVGL工程化落地的关键路径:分层目录结构、窗口模块封装、状态机式登录逻辑、TabView多页导航及图表/仪表盘动态可视化,覆盖从资源
前端预览图片的两种方式,Base64预览和blob预览
【日常记录】【JS】前端预览图片的两种方式,Base64预览和blob预览
机器人行业面试全攻略:从0到1拿下心仪Offer,看这一篇就够了
【摘要】2026年机器人行业迎来爆发期,全球市场规模超800亿美元,人才争夺激烈。本文针对机器人行业面试提供系统攻略:首先需明确岗位方向、打造差异化标签并了解目标公司;技术面试高频考点包括ROS框架、SLAM导航、运动控制、深度学习和嵌入式系统;项目介绍需采用STAR+R结构并量化成果;行为面试需注意协作能力与职业规划。文章还总结了简历堆砌、单向输出等五大常见误区,强调长期积累与精准准备的重要性,助力求职者把握行业窗口期机会。
前端下载文件以及上传图片预览,顺便了解arrayBuffer和blob
TL;DR 前端下载的关键靠<a href="demo.jpg" download>下载图片</a> 后端传blob,前端处理blob,然后下载文件 二进制数组arrayBuffer、typedArray、dataView相关内容 blob、file相关内容 上传图片预览的两种方式:blobURL和dataURL 下载的关键----a的download属性 想要实现点...
【华为OD机试真题E卷】300、 出租车计费 、靠谱的车 | 机试真题+思路参考+代码分析(C++、Java、Py、C语言、JS)
题目描述 >程序员小明打了一辆出租车去上班,出于职业敏感,他注意到这辆出租车的计费表有点问题,总是偏大,出租车司机解释说他不喜欢数字4,所以改装了计费表,任何数字位置遇到数字4就直接跳过,其余功能都正常 > 比如: 1、23再多一块钱就变为25; 2、39再多一块钱变为50; 3、399再多一块钱变为500; > 小明识破了司机的伎俩,准备利用自己的学识打败司机的阴谋,给出计费表的表面读数,返回实际产生的费用
老版QQ原生表情gif动态
这是老版的QQ表情,不过全是动态的的,Windows照片查看器是不会动的,可以右击用浏览器打开查看,再说一遍是老版的,只是分享给宁愿用老版也要动态的人。
blob 的使用 文件下载 图片预览 大文件分片上传
1. 文件下载。
深度学习工具包 DeepLearningToolbox
深度学习工具包Deprecation notice.-----This toolbox is outdated and no longer maintained.There are much better tools available for deep learning than this toolbox, e.g. [Theano](http://deeplearning.net/software/theano/), [torch](http://torch.ch/) or [tensorflow](http://www.tensorflow.org/)I would suggest you use one of the tools mentioned above rather than use this toolbox.Best, Rasmus.DeepLearnToolbox================A Matlab toolbox for Deep Learning.Deep Learning is a new subfield of machine learning that focuses on learning deep hierarchical models of data.It is inspired by the human brain's apparent deep (layered, hierarchical) architecture.A good overview of the theory of Deep Learning theory is[Learning Deep Architectures for AI](http://www.iro.umontreal.ca/~bengioy/papers/ftml_book.pdf)For a more informal introduction, see the following videos by Geoffrey Hinton and Andrew Ng.* [The Next Generation of Neural Networks](http://www.youtube.com/watch?v=AyzOUbkUf3M) (Hinton, 2007)* [Recent Developments in Deep Learning](http://www.youtube.com/watch?v=VdIURAu1-aU) (Hinton, 2010)* [Unsupervised Feature Learning and Deep Learning](http://www.youtube.com/watch?v=ZmNOAtZIgIk) (Ng, 2011)If you use this toolbox in your research please cite [Prediction as a candidate for learning deep hierarchical models of data](http://www2.imm.dtu.dk/pubdb/views/publication_details.php?id=6284)```@MASTERSTHESIS\{IMM2012-06284, author = "R. B. Palm", title = "Prediction as a candidate for learning deep hierarchical models of data", year = "2012",}```Contact: rasmusbergpalm at gmail dot comDirectories included in the toolbox-----------------------------------`NN/` - A library for Feedforward Backpropagation Neural Networks`CNN/` - A library for Convolutional Neural Networks`DBN/` - A library for Deep Belief Networks`SAE/` - A library for Stacked Auto-Encoders`CAE/` - A library for Convolutional Auto-Encoders`util/` - Utility functions used by the libraries`data/` - Data used by the examples`tests/` - unit tests to verify toolbox is workingFor references on each library check REFS.mdSetup-----1. Download.2. addpath(genpath('DeepLearnToolbox'));Example: Deep Belief Network---------------------```matlabfunction test_example_DBNload mnist_uint8;train_x = double(train_x) / 255;test_x = double(test_x) / 255;train_y = double(train_y);test_y = double(test_y);%% ex1 train a 100 hidden unit RBM and visualize its weightsrand('state',0)dbn.sizes = [100];opts.numepochs = 1;opts.batchsize = 100;opts.momentum = 0;opts.alpha = 1;dbn = dbnsetup(dbn, train_x, opts);dbn = dbntrain(dbn, train_x, opts);figure; visualize(dbn.rbm{1}.W'); % Visualize the RBM weights%% ex2 train a 100-100 hidden unit DBN and use its weights to initialize a NNrand('state',0)%train dbndbn.sizes = [100 100];opts.numepochs = 1;opts.batchsize = 100;opts.momentum = 0;opts.alpha = 1;dbn = dbnsetup(dbn, train_x, opts);dbn = dbntrain(dbn, train_x, opts);%unfold dbn to nnnn = dbnunfoldtonn(dbn, 10);nn.activation_function = 'sigm';%train nnopts.numepochs = 1;opts.batchsize = 100;nn = nntrain(nn, train_x, train_y, opts);[er, bad] = nntest(nn, test_x, test_y);assert(er < 0.10, 'Too big error');```Example: Stacked Auto-Encoders---------------------```matlabfunction test_example_SAEload mnist_uint8;train_x = double(train_x)/255;test_x = double(test_x)/255;train_y = double(train_y);test_y = double(test_y);%% ex1 train a 100 hidden unit SDAE and use it to initialize a FFNN% Setup and train a stacked denoising autoencoder (SDAE)rand('state',0)sae = saesetup([784 100]);sae.ae{1}.activation_function = 'sigm';sae.ae{1}.learningRate = 1;sae.ae{1}.inputZeroMaskedFraction = 0.5;opts.numepochs = 1;opts.batchsize = 100;sae = saetrain(sae, train_x, opts);visualize(sae.ae{1}.W{1}(:,2:end)')% Use the SDAE to initialize a FFNNnn = nnsetup([784 100 10]);nn.activation_function = 'sigm';nn.learningRate = 1;nn.W{1} = sae.ae{1}.W{1};% Train the FFNNopts.numepochs = 1;opts.batchsize = 100;nn = nntrain(nn, train_x, train_y, opts);[er, bad] = nntest(nn, test_x, test_y);assert(er < 0.16, 'Too big error');```Example: Convolutional Neural Nets---------------------```matlabfunction test_example_CNNload mnist_uint8;train_x = double(reshape(train_x',28,28,60000))/255;test_x = double(reshape(test_x',28,28,10000))/255;train_y = double(train_y');test_y = double(test_y');%% ex1 Train a 6c-2s-12c-2s Convolutional neural network %will run 1 epoch in about 200 second and get around 11% error. %With 100 epochs you'll get around 1.2% errorrand('state',0)cnn.layers = { struct('type', 'i') %input layer struct('type', 'c', 'outputmaps', 6, 'kernelsize', 5) %convolution layer struct('type', 's', 'scale', 2) %sub sampling layer struct('type', 'c', 'outputmaps', 12, 'kernelsize', 5) %convolution layer struct('type', 's', 'scale', 2) %subsampling layer};cnn = cnnsetup(cnn, train_x, train_y);opts.alpha = 1;opts.batchsize = 50;opts.numepochs = 1;cnn = cnntrain(cnn, train_x, train_y, opts);[er, bad] = cnntest(cnn, test_x, test_y);%plot mean squared errorfigure; plot(cnn.rL);assert(er<0.12, 'Too big error');```Example: Neural Networks---------------------```matlabfunction test_example_NNload mnist_uint8;train_x = double(train_x) / 255;test_x = double(test_x) / 255;train_y = double(train_y);test_y = double(test_y);% normalize[train_x, mu, sigma] = zscore(train_x);test_x = normalize(test_x, mu, sigma);%% ex1 vanilla neural netrand('state',0)nn = nnsetup([784 100 10]);opts.numepochs = 1; % Number of full sweeps through dataopts.batchsize = 100; % Take a mean gradient step over this many samples[nn, L] = nntrain(nn, train_x, train_y, opts);[er, bad] = nntest(nn, test_x, test_y);assert(er < 0.08, 'Too big error');%% ex2 neural net with L2 weight decayrand('state',0)nn = nnsetup([784 100 10]);nn.weightPenaltyL2 = 1e-4; % L2 weight decayopts.numepochs = 1; % Number of full sweeps through dataopts.batchsize = 100; % Take a mean gradient step over this many samplesnn = nntrain(nn, train_x, train_y, opts);[er, bad] = nntest(nn, test_x, test_y);assert(er < 0.1, 'Too big error');%% ex3 neural net with dropoutrand('state',0)nn = nnsetup([784 100 10]);nn.dropoutFraction = 0.5; % Dropout fraction opts.numepochs = 1; % Number of full sweeps through dataopts.batchsize = 100; % Take a mean gradient step over this many samplesnn = nntrain(nn, train_x, train_y, opts);[er, bad] = nntest(nn, test_x, test_y);assert(er < 0.1, 'Too big error');%% ex4 neural net with sigmoid activation functionrand('state',0)nn = nnsetup([784 100 10]);nn.activation_function = 'sigm'; % Sigmoid activation functionnn.learningRate = 1; % Sigm require a lower learning rateopts.numepochs = 1; % Number of full sweeps through dataopts.batchsize = 100; % Take a mean gradient step over this many samplesnn = nntrain(nn, train_x, train_y, opts);[er, bad] = nntest(nn, test_x, test_y);assert(er < 0.1, 'Too big error');%% ex5 plotting functionalityrand('state',0)nn = nnsetup([784 20 10]);opts.numepochs = 5; % Number of full sweeps through datann.output = 'softmax'; % use softmax outputopts.batchsize = 1000; % Take a mean gradient step over this many samplesopts.plot = 1; % enable plottingnn = nntrain(nn, train_x, train_y, opts);[er, bad] = nntest(nn, test_x, test_y);assert(er < 0.1, 'Too big error');%% ex6 neural net with sigmoid activation and plotting of validation and training error% split training data into training and validation datavx = train_x(1:10000,:);tx = train_x(10001:end,:);vy = train_y(1:10000,:);ty = train_y(10001:end,:);rand('state',0)nn = nnsetup([784 20 10]); nn.output = 'softmax'; % use softmax outputopts.numepochs = 5; % Number of full sweeps through dataopts.batchsize = 1000; % Take a mean gradient step over this many samplesopts.plot = 1; % enable plottingnn = nntrain(nn, tx, ty, opts, vx, vy); % nntrain takes validation set as last two arguments (optionally)[er, bad] = nntest(nn, test_x, test_y);assert(er < 0.1, 'Too big error');```[](https://bitdeli.com/free "Bitdeli Badge")
Blob的一些使用 - 下载、图片预览、切片上传
Blob的一些使用 - 下载、图片预览、切片上传
lwip-2.0.3
lwip是瑞典计算机科学院(SICS)的Adam Dunkels 开发的一个小型开源的TCP/IP协议栈。实现的重点是在保持TCP协议主要功能的基础上减少对RAM 的占用。
android 蓝牙通讯demo
android 下蓝牙通讯demo,实现了发现蓝牙,使能蓝牙,通过蓝牙发送消息。
图片上传之blob对象预览
今天听同事说有些图片上传控件,可以不需要先上传,就可以预览,并且桌面浏览器和手机浏览器都兼容。 于是在网上找了几个例子,查看其工作原理,发现都是利用blob对象,但网上的例子,代码都很繁琐。 因此花点时间,自己封装了一个简单实用的jquery控件。 相对网上的繁杂的代码,我的例子代码简洁易读,并且自带表单对象(formdata)提交,大家可以方便的扩展或改写。 废话不多说,先上js控件代码
html js 实现图片上传,压缩,预览及图片压缩后得到Blob对象继续上传问题
先上效果 上传图片后(设置了最多上传3张图片,三张后上传按钮消失) 点击图片放大,可以使用删除和旋转按钮 (旋转功能主要是因为ios手机拍照后上传会有写图片被自动旋转,通过旋转功能可以调正) ht...
vue进行多图片上传、压缩、旋转、转blob格式、canvas绘制最后图片预览
vue进行多图片上传、压缩、旋转、转blob格式、canvas绘制最后图片预览
利用blob对象预览将上传的图片
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Blob Test</title> <script> function handleFile(e) { // 取得文件并生成blob流 var file = e.files[0];
上传图片 转blob文件 预览图片
let options = { types: [ { accept: { 'audio/mp3+wma+wav': ['.mp3', '.wma', '.wav'], }, }, ], }; let fileHandle;
input上传图片(file),预览图片的两种方法。blob与base64编码
上传图片时一般都需要预览,我一般用这两种方法来实现。base64编码可以直接上传到后台,后台解析下,得到的文件就会比较小了,省去了压缩图片这一步了。 //获取对象input file 的图片地址,放进img $("#file").change(function () {//input的id var objUrl =...
php blob:上传图片,上传图片,预览并保存成blob类型 和 base64
场景: 获取到一个file类型的图片,如果直接在html中预览?这里就是利用html5的新特性,将图片转换为Base64的形式显示出来。有两种方法:方法一:利用URL.createObjectURL()base window.onload = function () {let $img = document.getElementById('img')file.onchange = functio...
记录一下Vue本地上传文件/图片预览并手动上传图片,并使用XMLHttpRequest解决线上fetch转不了blob的问题
以下为前端使用vue3实现的blodUrl==》blod==》file==》FromData 2023.3.7更新。
5158



被折叠的 条评论
为什么被折叠?



