基于 jQuery 的图片上传逻辑示例

HTML 代码：

<form id="uploadForm" enctype="multipart/form-data">
   <input type="file" name="image" id="imageInput">
   <input type="button" value="上传" id="uploadButton">
</form>
<div id="preview"></div>

JavaScript 代码：

$(document).ready(function() {
    // 绑定上传按钮点击事件
    $('#uploadButton').click(function() {
        var form = $('#uploadForm')[0];
        var formData = new FormData(form);
        $.ajax({
            url: '/upload',  // 上传地址
            type: 'POST',
            dataType: 'json',
            data: formData,
            processData: false,
            contentType: false,
            success: function(data) {
                if (data.success) {
                    // 上传成功，显示预览图像
                    $('#preview').html('<img src="' + data.imageUrl + '">');
                } else {
                    // 上传失败，提示错误信息
                    alert(data.message);
                }
            },
            error: function(xhr, textStatus, errorThrown) {
                alert('上传失败: ' + xhr.responseText);
            }
        });
    });
});