支持文件上传的html表单
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了支持文件上传的html表单相关的知识，希望对你有一定的参考价值。
<html>
<head><title>3-6支持文件上传的表单</title></head>
<body>
<!--表单enctype属性必须制定为mutipart/form-data-->
<form enctype的type属性指定为file，name属性的值将会在php程序的$-FILE数组中用到-->
上传此文件：<inpute name="my file" type="file"/>
<inpute type="submit"value="提交上传"/>
</form>
</body>
</html>
问题：
/是关闭符号吗？是哪段文字的关闭符号？
$-FILE['mylife']['name']表示客户端文件的原始名臣，即要上传文件的文件名，其中myfile就是在代码3-6中定义的input元素的name属性的值：<input name ="myfile"type="file"/>
这儿的/是不是关闭符号？关的哪段文字？
$_FILES['myfile']['tmp_name']表示文件上传后，在服务器端存储的临时文件名。
tmp是什么？
文件提交后，一般会被存储到服务器的默认临时目录中，可以通过修改php.ini中的up_tmp_dir项，修改为其他路径。
dir是什么？是什么的缩写？
input是可以不用关闭的
tmp是 temporal 暂时的
dir是 directory 目录
都是变量名，不必纠结 参考技术A 更新：
其实我自己没有亲自试过，你可以看一下这个网页：
提问者给的第二段代码，他自己说工作得很好，里面有用到cookie，不知道对你有没有帮助……
——————————————————————
有人写了一个 urllib2 的扩展使其支持简单的文件上传：
下载回来安装后试试：
import urllib2_file
import urllib2
data = 'name': 'value',
'file': open('/etc/services')
urllib2.urlopen('', data)
open() 函数的参数改成你想上传的文件名 参考技术B 推荐你阅读一下
http://www.w3school.com.cn/php/php_file_upload.asp
html多文件上传，可支持预览
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>表单提交</title> 6 <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script> 7 </head> 8 <body> 9 10 <!--文件上传--> 11 <form id="uploadForm" enctype="multipart/form-data"> 12 <div id="fileId" style=‘display: none‘><!--//style=‘display: none‘--> 13 14 </div> 15 <div id="img-con" class="panel panel-default imgdiv"> 16 17 18 </div> 19 <p id="em">未上传文件</p> 20 <input type="button" value="点击事件" name="点击事件" onclick="inputClieck()"><br> 21 <input type="submit"> 22 </form> 23 </body> 24 <script> 25 26 var inputArray = []; 27 28 function inputClieck() { 29 var newInput = document.createElement("input"); 30 newInput.type = ‘file‘; 31 newInput.name = "files"; 32 var idid = new Date().getTime(); 33 newInput.id = idid; 34 $("#fileId").append(newInput); 35 inputArray.push(idid); 36 37 $("#" + idid).click(); 38 39 40 $("#" + idid).change(function (e) { 41 console.log(‘change事件‘, e); 42 console.log(this) 43 var path= getImgPath(this.files[0]); 44 console.log("--------"+path); 45 46 var arr = path.split("/"); 47 var strPath=‘--------:null/‘+arr[arr.length-1]; 48 console.log(strPath) 49 var a=createImg(path,idid); 50 $("#em").append(a) 51 52 }); 53 var newline = document.createElement("br");//创建一个BR标签是为能够换行！ 54 $("#fileId").append(newline); 55 } 56 57 //动态显示上传图片 58 function uploadImg(path) { 59 var imgDiv = $("#img-con"); 60 var $img = $("<img/>"); 61 $img.attr("src", path); 62 imgDiv.append($img); 63 } 64 65 66 67 68 //获取要上传单张图片的本地路径 69 function getImgPath(file) { 70 71 72 var url = null; 73 if(window.createObjectURL != undefined) { // basic 74 url = window.createObjectURL(file); 75 } else if(window.URL != undefined) { // mozilla(firefox) 76 url = window.URL.createObjectURL(file); 77 } else if(window.webkitURL != undefined) { // webkit or chrome 78 url = window.webkitURL.createObjectURL(file); 79 } 80 return url; 81 } 82 83 84 85 86 function createImg(src,idid) { 87 var box = $("<div class=‘img-box uploadfile‘>"); 88 89 var newImg = document.createElement("img"); 90 newImg.src=src; 91 newImg.id="img"+idid; 92 newImg.height=100; 93 newImg.width=100; 94 newImg.onclick=‘showImagePopup(\"" + src + "\")‘; 95 96 //box.append("<img src=‘" + src + "‘ height=‘100px‘ width=‘100px‘ onclick=‘showImagePopup(\"" + src + "\")‘>"); 97 box.append(newImg); 98 return box; 99 } 100 101 function showImagePopup(src) { 102 if (getClass(src) === "String") { 103 var popup = $("<img></img"); 104 popup.addClass("image-popup").attr("src", src); 105 var shade = $("<div></div>").addClass("shade"); 106 $(document.body).append(shade.append(popup)); 107 shade.click(function () { 108 $(this).remove(); 109 }); 110 popup.fadeIn(200); 111 // popup.click(function() { 112 // window.event ? window.event.cancelBubble = true : 113 // window.event.stopPropagation(); 114 // }); 115 } 116 } 117 118 119 </script> 120 </html>
以上是关于支持文件上传的html表单的主要内容，如果未能解决你的问题，请参考以下文章