源码网商城,靠谱的源码在线交易网站 我的订单 购物车 帮助

源码网商城

一个伪ajax图片上传代码实现示例

  • 时间:2021-06-23 12:11 编辑: 来源: 阅读:
  • 扫一扫,手机访问
摘要:一个伪ajax图片上传代码实现示例
[u]复制代码[/u] 代码如下:
<?php if($_FILES){ ?> <script> window.parent.ajaxUploadPicture.uploadCallback('http://img0.bdstatic.com/img/image/5099213b07eca8065380ce7f75e95dda144ad348269.jpg'); </script> <?php die; } ?> <!DOCTYPE html> <html> <head> <script> ajaxUploadPicture = { $o1:'' }; ajaxUploadPicture.ajaxUploadFile = function ($o){ this.$o1 = $o; var $iframe = document.createElement('iframe'); $iframe.style.display = 'none'; $iframe.name = 'iframe'; $iframe.id = 'iframe'; document.body.appendChild($iframe); var $form = document.createElement("form"); $form.method = "post"; $form.enctype = "multipart/form-data"; $form.action = ""; $form.target = 'iframe'; $newO = $o.cloneNode(); $form.appendChild($newO); $form.submit(); } ajaxUploadPicture.uploadCallback = function ($url){ $pic = document.createElement('img'); $pic.width = "200"; $pic.height = "150"; $pic.src = $url; if(document.getElementById('picshow') == null){ $div = document.createElement("div"); $div.id = 'picshow'; this.$o1.parentNode.insertBefore($div,this.$o1.nextSibling); }else{ $div = document.getElementById('picshow'); } $div.innerHTML = ''; $div.appendChild($pic); }; </script> </head> <body> <input type="file" name="file" onchange = "ajaxUploadPicture.ajaxUploadFile(this);"> </body> </html>
面向对象思想,form提交到一个隐藏的iframe,执行回调js函数。实现图片回显。后台php的功能没有完善。
  • 全部评论(0)
联系客服
客服电话:
400-000-3129
微信版

扫一扫进微信版
返回顶部