Javascript 如何在AJAX Success函数中调用element.onload？

我在php codeignitor中使用AJAX上传一个图像，上传时返回一个包含上传图像路径的JSON响应，然后将该路径插入img标记中进行预览

现在我想做的是更新路径后得到渲染img标记的高度和宽度，但问题是我总是得到一个0，所以请有人来帮我

这是我的JS

function uploadAd(){ // console.log($('#uploadedPDF').prop('files')); var file_data = $('#uploadedAdFile').prop('files')[0]; var form_data = new FormData(); form_data.append('uploadedAdFile', file_data); // alert(form_data); $.ajax({ url: BASE_URL+'home/uploadAdFile', // point to server-side PHP script dataType: 'json', // what to expect back from the PHP script, if anything cache: false, contentType: false, processData: false, data: form_data, type: 'post', async: false, success: function(data){ console.log(data); if(data.status == -1){ // If file extension Validation failed $('#uploadedAdFileMsg').html(data.msg); $('#uploadedAdFileMsg').removeClass('hidden'); $('#uploadedAdFilePreview').addClass('hidden'); } else{ // If file extension Validation passed $('#uploadedAdFilePreview').attr('src', data.path); // Render file in img tag $('#uploadedAdFileMsg').addClass('hidden'); $('#uploadedAdFilePreview').removeClass('hidden'); console.log(document.getElementById('uploadedAdFilePreview').naturalWidth); // console.log() } }, complete: function(){ console.log('Complte '+document.getElementById('uploadedAdFilePreview').naturalWidth); } }).done(function(){ console.log('Done '+document.getElementById('uploadedAdFilePreview').naturalWidth); }); } $(document).ajaxComplete(function(){ console.log('AJAX '+document.getElementById('uploadedAdFilePreview').naturalWidth); }) 函数uploadAd（）{ //console.log（$（'#uploadedPDF'）.prop（'files'））； var file_data=$（'#uploadedFile'）.prop（'files'）[0]； var form_data=new FormData（）； form_data.append（'uploadedafile'，file_data）； //警报（表格数据）； $.ajax({ url:BASE_url+'home/uploadfile'，//指向服务器端PHP脚本 dataType:'json'，//从PHP脚本中得到什么，如果有的话 cache:false， contentType:false， processData:false， 数据：表格数据， 键入：“post”， async:false， 成功：功能（数据）{ 控制台日志（数据）； 如果（data.status==-1）{ //如果文件扩展名验证失败 $（'#uploadedFileMsg'）.html（data.msg）； $（'#uploadedFileMsg'）。removeClass（'hidden'）； $（'UploadedFileReview'）.addClass（'hidden'）； } 否则{ //如果文件扩展名验证通过 $（'#uploadedFileReview'）.attr（'src'，data.path）；//在img标记中呈现文件 $（'#uploadedFileMsg'）.addClass（'hidden'）； $（'UploadedFileReview'）。removeClass（'hidden'）； log（document.getElementById（'uploadedFileReview'）.naturalWidth）； //console.log（） } }, 完成：函数（）{ console.log（'Complte'+document.getElementById（'uploadedFileReview'））.naturalWidth）； } }).done（函数（）{ console.log（'Done'+document.getElementById（'uploadedFileReview'））.naturalWidth）； }); } $（文档）.ajaxComplete（函数（）{ log（'AJAX'+document.getElementById（'uploadedFileReview'））.naturalWidth）； }) 正如你所看到的，我在不同的地方插入了高度代码，但没有运气

附言：我也用了clientHeight、height和naturalHeight，但还是得到了0

因此，我得出的结论是，在img标记呈现其内容之前调用了height函数，因此它显示为0

那么，我可以在AJAX成功函数中包含一个onload类型的函数吗

谢谢

我解决了：D

实际上，我在Jquery返回的对象上使用了onload，这是错误的，应该在

document.getElement

上使用它，所以我在

element.onload=function（）{getHeight（）；}

---

在我的成功函数os AJAX中，它起了作用：）

您是否尝试过将图像硬编码到包含广告的元素中。如果图像元素的高度仍然为0，那么您可能需要安装一些css，以便元素具有一定的高度来渲染图像。在你解决了这个问题之后，你的javascript应该可以正常工作。也许不使用它来膨胀客户端逻辑会更容易，但只需在服务器端获取图像尺寸（

getimagesize

），然后在JSON结构中返回宽度和高度…？@Tyler CSS没有问题，在AJAX请求后，我从浏览器开发人员控制台获得了正确的高度和宽度。@CBroe但我想知道如何使用Js:）解决此问题，您不需要使用document.getElement…-只需通过

$（'#foo'）[0]