<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>iFrame异步文件上传</title> </head> <body> <h1>iFrame异步文件上传</h1> <form method="post" enctype="multipart/form-data"> 用户名: <input type="text" /><br /> 上传头像: <input type="file" onchange="startUpload(this.form)" /> <iframe mce_style="display:none"></iframe> <input type="hidden" value="" /> <p></p> <input type="submit" value="提交" /> </form> <?php //页面提交后显示相关信息 if (isset($_POST['submitted'])) { $html = '<hr /><p>上传成功！</p>'; $html .= '<p>用户名：'.htmlspecialchars($_POST['username']).'</p>'; $html .= '<p>头像地址：'.htmlspecialchars($_POST['photo']).'</p>'; $html .= '<p><img src="'.htmlspecialchars($_POST['photo']).'" mce_src="'.htmlspecialchars($_POST['photo']).'" /></p><hr />'; echo $html; } ?> </body> </html> <mce:script type="text/javascript"><!-- //选择了文件后开始异步上传 function startUpload(oForm) { document.getElementById('displayphoto').innerHTML = 'Loading...'; oForm.action = 'proceedupload.php'; oForm.target = 'uploadframe'; oForm.submit(); } //整个页面的提交 function formSubmit(oForm) { oForm.action = document.URL; oForm.target = '_self'; oForm.submit(); } // --></mce:script>
proceedupload.php页面如下:
<?php //这里仅以特定图片格式举例，本应动态获取 $url = 'upload/img' . time() . '.jpg'; if (move_uploaded_file($_FILES['uploadphoto']['tmp_name'], $url)) { //删除之前的图片 $_POST['photo'] !== '' && unlink($_POST['photo']); ?> <html> <head> <body> </body> </html> <mce:script type="text/javascript"><!-- //在页面上显示刚刚上传成功的图像 function doneLoading(theFrame, url) { var oDiv = theFrame.document.getElementById('displayphoto'); oDiv.innerHTML = '<img src="' + url + '" mce_src="' + url + '" alt="上传头像" />'; theFrame.document.getElementById('photo').value = url; } // --></mce:script> <?php } ?>
感兴趣的朋友可以测试运行一下本文实例，相信本文所述对大家PHP程序设计的学习有一定的借鉴价值。
相关文章
精彩导读
热门资讯
关注我们
