无刷新预览所选择的图片示例代码

2024-12-01 08:17:51

代码如下

代码如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript">
//本地图片预览
function setImagePreview(fieldupload, image, imagediv) {
var docObj = document.getElementById(fieldupload);
var imgObjPreview = document.getElementById(image);
if (docObj.files && docObj.files[0]) {
//火狐下，直接设img属性
imgObjPreview.style.display = 'block';
imgObjPreview.style.width = '150px';
imgObjPreview.style.height = '150px';
//imgObjPreview.src = docObj.files[0].getAsDataURL();
//火狐7以上版本不能用上面的getAsDataURL()方式获取，需要一下方式
imgObjPreview.src = window.URL.createObjectURL(docObj.files[0]);
} else {
//IE下，使用滤镜
docObj.select();
var imgSrc = document.selection.createRange().text;
var localImagId = document.getElementById(imagediv);
//必须设置初始大小
localImagId.style.width = "150px";
localImagId.style.height = "150px";
//图片异常的捕捉，防止用户修改后缀来伪造图片
try {
localImagId.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale)"; localImagId.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = imgSrc;
} catch (e) {
alert("您上传的图片格式不正确，请重新选择!");
return false;
}
imgObjPreview.style.display = 'none';
document.selection.empty();
}
return true;
}
</script>
</head>

无刷新预览所选择的图片示例代码

代码如下复制代码代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equi
Qt实现保存、浏览、预览、打印功能的示例代码

Qt提供了以文本.图片.HTML等方式来实现对文档的操作,主要用到了QPrinter类和QPainter类,用到了QFileDialog文件窗口.QPrintPreviewDialog预览窗口类和QPrintDialog打印窗口类,Qt5也提供了QPdfWriter类来实现对pdf的操作,这里并不包括打开pdf文件,Qt没有提供任何方法来直接像文件浏览器一样打开pdf文件,可以用第三方库来实现. 这里采用了图片的方式来实现保存.预览和打印,其实三个功能基本上一样. 1.保存PDF (1)保存某
【JS+CSS3】实现带预览图幻灯片效果的示例代码

一.前期准备 1.1 案例分析适用场景:单例布局 1.2 方法论 V视图 HTML+CSS+调试 C js实现控制流程 D数据优化扩展二.代码结构 <div class="slider"> <div class="main"> <div class="main_i"> <div class="caption&quo
Android camera实时预览实时处理，人脸识别示例

Android camera实时预览实时处理,面部认证. 预览操作是网友共享的代码,我在继承SurfaceView 的CameraSurfaceView 中加入了帧监听事件,每次预览监听前五个数据帧,在处理做一个面部识别. 先看目录关系自定义控件CameraSurfaceView.java 自定义接口方法CameraInterface.java CameraActivity预览界面. CameraSurfaceView.Java package com.centaur.camera.prev
Android 打开相册选择单张图片实现代码

Android 打开相册选择单张图片实现代码以下就是如何在应用中打开图库并选择一张图片进行应用,代码很简单,注释很详细. 实现代码: btn8.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { /*在Activity Action里面有一个"ACTION_GET_CONTENT"字符串常量, // 该常量让用户选择特定类型
Opencv判断颜色相似的图片示例代码

问题描述有一个项目,大体是要判断一下一篇文章内的配图突不突兀. 素材准备所以就从网上随便找了4张图: 可以看出,前3张图片从颜色上.从阅读感受上,应该是相似的,而最后一张应该是不同的. 而当我们只对图片做缩放(为了跑得快),然后用bgr通道出直方图算相似度时: 却发现,只有第一张和第二张图片的相似度是大于0.5的,而第二.三张,以及第三.四张图片之间的相似度几乎都小于等于0.1. 思考方法于是,经过思考后我觉得,判断两张图片在颜色上相不相似,其本质在于判断其直方图分布的形状相不相似,而不应
JavaScript实现预览本地上传图片功能完整示例

本文实例讲述了JavaScript实现预览本地上传图片功能.分享给大家供大家参考,具体如下: <html> <head> <title>www.jb51.net 图片上传预览</title> <script> function PreviewImage(imgFile) { var pattern = /(\.*.jpg$)|(\.*.png$)|(\.*.jpeg$)|(\.*.gif$)|(\.*.bmp$)/; if (!pattern.t
Jquery+AJAX实现无刷新上传并重命名文件操作示例【PHP后台接收】

本文实例讲述了Jquery+AJAX实现无刷新上传并重命名文件操作.分享给大家供大家参考,具体如下: index.html <!DOCTYPE html> <html> <head> <title>Ajax上传图片</title> <meta charset="utf-8"> <script src="https://www.jq22.com/jquery/jquery-3.3.1.js"
JS预览图像将本地图片显示到浏览器上

复制代码代码如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <script type="text/javascript"&
Ajax 无刷新在注册用户名时的应用的代码

var xmlHttp; uName() //用户名失去焦点时 { if(all.uname.=="") { all.l1.innerHTML="不能为空!"; setTimeout("close(1)",1500); return; } else { xmlHttp=new ActiveXObject("Microsoft.XMLHTTP"); xmlHttp.onrea

无刷新预览所选择的图片示例代码

相关推荐

随机推荐