区别一般的上传,一般的上传要点击上传按钮,本例无按钮,选择图片后就自动上传
预 览
<script type="text/javascript" src="../../js/jquery-1.3.2.min.js"></script> <script type="text/javascript" src="scripts/jquery.form.js"></script> <script type="text/javascript" > $(document).ready(function() { $('#photoimg').live('change', function() { $("#preview").html(''); $("#preview").html('<img src="loader.gif" alt="Uploading...."/>'); $("#imageform").ajaxForm({ target: '#preview' }).submit(); }); }); </script> <div style="width:600px"> <form id="imageform" method="post" enctype="multipart/form-data" action='ajaximage.php'> 上传 <input type="file" name="photoimg" id="photoimg" /> </form> <div id='preview'> </div> </div>
<?php session_start(); $session_id='1'; //$session id $path = "../upload/"; $valid_formats = array("jpg", "png", "gif", "bmp"); if(isset($_POST) and $_SERVER['REQUEST_METHOD'] == "POST") { $name = $_FILES['photoimg']['name']; $size = $_FILES['photoimg']['size']; if(strlen($name)) { list($txt, $ext) = explode(".", $name); if(in_array($ext,$valid_formats)) { if($size<(1024*1024)) { $actual_image_name = time().substr(str_replace(" ", "_", $txt), 5).".".$ext; $tmp = $_FILES['photoimg']['tmp_name']; if(move_uploaded_file($tmp, $path.$actual_image_name)) { echo "<img src='../upload/".$actual_image_name."' class='preview'>"; } else echo "failed"; } else echo "Image file size max 1 MB"; } else echo "Invalid file format.."; } else echo "Please select image..!"; exit; } ?>
转载请注明:拈花古佛 » AJAX无刷新上传图片 可以实时预览