建立test文件夾
PHP代碼：
<?php//var_dump($_FILES['file']);exit;if(isset($_GET['option']) && $_GET['option']=='delete'){ @file_put_contents(dirname(__FILE__)."/------------0.txt", $_GET['path']."/r/n",FILE_APPEND); unlink($_GET['path']); $rs[] = array( 'success'=>true, 'info'=>'ok' ); if(file_exists($_GET['path'])){ $rs[]['success']=false; $rs[]['info']='未刪除'; } die(json_encode($rs));}if ((($_FILES["file"]["type"] == "image/gif")|| ($_FILES["file"]["type"] == "image/jpeg")|| ($_FILES["file"]["type"] == "image/png")|| ($_FILES["file"]["type"] == "image/pjpeg"))&& ($_FILES["file"]["size"] < (1024*1024))){ if ($_FILES["file"]["error"] > 0) { echo "Return Code: " . $_FILES["file"]["error"] . "<br />"; } else { if (file_exists("test/" . $_FILES["file"]["name"])) { $fn = $_FILES["file"]["name"]; } else { $imgurl = substr($_FILES["file"]["name"], strpos($_FILES["file"]["name"], '.')); $imgurl = date("YmdHis",time()).$imgurl; move_uploaded_file($_FILES["file"]["tmp_name"],"test/" . $imgurl); $fn = "test/" . $imgurl; } } $return_str[] = array( 'guid'=>date('His',time()), 'path'=>'test/', 'fileName'=>$fn, 'success'=>true );}else{ $return_str[] = array( 'guid'=>date('His',time()), 'path'=>'test/', 'fileName'=>$_FILES["file"]["name"], 'success'=>false, 'error'=>$_FILES["file"]["error"] );} echo json_encode($return_str); ?>HTML代碼：
<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head> <meta http-equiv="Content-Type" content="multipart/form-data; charset=utf-8" /> <title>文件上傳</title> <style type="text/css"> .btn { position: relative; background-color: blue; width: 80px; text-align: center; font-size: 12px; color: white; line-height: 30px; height: 30px; border-radius: 4px; } .btn:hover { cursor: pointer; } .btn input { opacity: 0; filter: alpha(opacity=0); position: absolute; top: 0px; left: 0px; line-height: 30px; height: 30px; width: 80px; } #fileLsit li span { margin-left: 10px; color: red; } #fileLsit { font-size: 12px; list-style-type: none; } </style></head><body> <div class="btn"> <span>添加附件</span> <!--這里注意：file 標簽必須具有name屬性，由于沒有加name屬性，文件上傳不到服務到哪--> <input type="file" id="fileName" name="file" /> </div> <ul id="fileLsit" style="border:1px solid red;"> </ul> <!--引入jquery類庫--> <script type="text/javascript" src="js/jquery.js"></script> <!--引入jquery.form插件--> <script type="text/javascript" src="js/jquery.form.js"></script> <script type="text/javascript"> jQuery(function () { var option = { type: 'post', dataType: 'json', //數(shù)據(jù)格式為json resetForm: true, beforeSubmit: showRequest,//提交前事件 uploadProgress: uploadProgress,//正在提交的時間 success: showResponse//上傳完畢的事件 } jQuery('#fileName').wrap( '<form method="post" action="test.php" id="myForm2" enctype="multipart/form-data"></form>'); jQuery('#fileName').change(function () { $('#myForm2').ajaxSubmit(option); }); }); //刪除文件 var deleteFile = function (path, guid) { console.log(path+'/'+guid); jQuery.getJSON('test.php?option=delete', { path: path }, function (reslut) { console.log(path+'/'+guid+''+reslut[0].info); if (reslut[0].success) {//刪除成功 jQuery('#' + guid).remove(); console.log('刪除成功'); } else {//刪除失敗 alert(reslut[0].info); } }); console.log('end'); } //上傳中 var uploadProgress = function (event, position, total, percentComplete) { jQuery('.btn span').text('上傳中...'); } //開始提交 function showRequest(formData, jqForm, options) { jQuery('.btn span').text('開始上傳..'); var queryString = $.param(formData); } //上傳完成 var showResponse = function (responseText, statusText, xhr, $form) { console.log(responseText); if (responseText[0].success) {//成功之后返回文件地址、文件名稱等信息 拼接呈現(xiàn)到html里面。 var str = '<li id="' + responseText[0].guid + '"><a href="' + responseText[0].fileName + '" target="_blank">' + responseText[0].fileName + '</a><span onclick="deleteFile(/'' + responseText[0].fileName + '/',/'' + responseText[0].guid + '/')" >刪除</span></li>'; jQuery('#fileLsit').append(str); } jQuery('.btn span').text('上傳完成'); jQuery('.btn span').text('添加附件'); } </script></body></html>以上所述是小編給大家介紹的jQuery.Form上傳文件操作，希望對大家有所幫助，如果大家有任何疑問歡迎給留言，小編會及時回復大家的！
新聞熱點
疑難解答
