这段代码展示了如何在网页中实现图片上传功能，通过JavaScript的Ajax异步请求，用户无需刷新页面即可完成图片上传，并实时预览图片。功能包括移除旧的上传表单、创建新的上传表单、触发文件选择以及使用定时器检查文件是否已选择。当文件选择后，会发送POST请求到服务器，成功返回时更新图片显示和输入字段的值。
无需表单，直接加点击事件即可，
caseimg为input表单，image为图片显示
function upimage() {
$('#form-upload').remove();
$('body').prepend('
');$('#form-upload input[name=\'file\']').trigger('click');
if (typeof timer != 'undefined') {
clearInterval(timer);
}
timer = setInterval(function() {
if ($('#form-upload input[name=\'file\']').val() != '') {
clearInterval(timer);
$.ajax({
url: '/manager/atlas_upload',
type: 'post',
dataType: 'json',
data: new FormData($('#form-upload')[0]),
cache: false,
contentType: false,
processData: false,
beforeSend: function() {
},
complete: function() {
},
success: function(json) {
if (json['rc']['error']) {
alert(json['rc']['error']);
}
if (json['rc']['success']) {
$('#image').attr('src',json['rc']['src']);
$('#caseimg').val(json['rc']['src']);
}
},
error: function(xhr, ajaxOptions, thrownError) {
alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
}
});
}
}, 500);
}
1499
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
