jquery+预览图片代码

JQuery 是一种流行的 JavaScript 库，可用于创建交互式 Web 页面。其中一项重要功能是预览图片。预览图片可让用户在上传图片之前预览所选图片，以确保图片选择正确。在本文中，我们将介绍如何使用 JQuery 实现预览图片的功能。

$(function () {
$('#file-input').change(function () {
var file = $(this)[0].files[0];
var fileReader = new FileReader();
fileReader.onload = function () {
$('#preview').attr('src', fileReader.result);
};
fileReader.readAsDataURL(file);
});
});

以上代码使用 JQuery 监听文件输入框的变化。当文件选择发生变化时，代码使用新的 FileReader 对象读取文件并将其转换为基于 Base64 的数据 URL。然后，代码将此 URL 用作图像的源，以显示所选图像的预览。

请注意，我们使用了选择器 #file-input 和 #preview ，这意味着我们必须在 HTML 代码中定义文件输入框和图像预览。例如：

<input type="file" id="file-input" />
<img id="preview" src="" />

请确保选择器与 HTML 标记相符合，因为选择器是代码正确工作的关键。

查看更多关于jquery+预览图片代码的详细内容...