在aspnet框架下用HTML+JS实现一个页面用于上传一个文件当文件类型是图片就显示出来如果是PDF文件就上传到后台转换为图片再返回 显示出来
以下是一个使用ASP.NET框架、HTML和JavaScript实现的文件上传页面示例。该示例会根据上传文件的类型，如果是图片则直接显示，如果是PDF文件则会将其上传到后台进行转换为图片，然后再返回并显示出来。
<!DOCTYPE html>
<html>
<head>
<title>文件上传页面</title>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script>
$(document).ready(function () {
$('#fileinput').on('change', function () {
var file = this.files[0];
var fileType = file.type;
if (fileType.startsWith('image/')) {
var reader = new FileReader();
reader.onload = function (e) {
$('#preview').attr('src', e.target.result);
}
reader.readAsDataURL(file);
} else if (fileType === 'application/pdf') {
var formData = new FormData();
formData.append('file', file);
$.ajax({
url: 'convert-pdf-to-image',
type: 'POST',
data: formData,
processData: false,
contentType: false,
success: function (response) {
$('#preview').attr('src', response.imageUrl);
},
error: function () {
alert('文件上传失败，请重试！');
}
});
}
});
});
</script>
</head>
<body>
<h1>文件上传页面</h1>
<input type="file" id="fileinput" accept=".jpg,.jpeg,.png,.pdf" />
<br /><br />
<img id="preview" alt="预览图" width="200" />
</body>
</html>
请注意，上述示例代码中的convert-pdf-to-image是一个后台处理程序的URL，用于将上传的PDF文件转换为图片并返回图片的URL。你需要根据你的具体需求来实现该后台处理程序。
此外，为了使示例代码能够正常运行，你需要在<head>标签中引入jQuery库。你可以根据需要自行下载或使用CDN链接。
原文地址: https://www.cveoy.top/t/topic/jatV 著作权归作者所有。请勿转载和采集!