Heim > Backend-Entwicklung > PHP-Tutorial > ajax--iframe模拟ajax文件上传效果

ajax--iframe模拟ajax文件上传效果

WBOY
Freigeben: 2016-07-29 09:05:15
Original
726 Leute haben es durchsucht

js无权读取本地的文件,so不能上传文件但是
有这几种方法
1 iframe伪装 jquery-uploaded-file
2 swf插件  (这个不讲,是一个单独的软件
3 html5

iframe模拟ajax文件上传效果
1捕捉表单提交动作
2创建iframe
3target修改指向 iframe
4去掉iframe


<h1></h1>
<!-- enctype 属性可能的值:
application/x-www-form-urlencoded
multipart/form-data
text/plain
规定在发送表单数据之前如何对其进行编码。

target
规定在何处打开 action URL。(这边是iframe里) 
onsubmit 点击运行js的方法通过才到`action

文件上传说没上传  enctype没写-->
	
Nach dem Login kopieren

js部分(用了jquery)  创建iframe 

<script type="text/javascript" src="http://libs.baidu.com/jquery/1.7.2/jquery.min.js"></script>
	
	<script type="text/javascript">
	function upfile(){
		// 创建iframe 和属性name
		var ifname = &#39;up&#39;+Math.random();
		$(&#39;<iframe name="&#39; + ifname +&#39;">&#39;).appendTo($(&#39;body&#39;));
		// form表单加入target属性,form点击在iframe打开
		$(&#39;form:first&#39;).attr(&#39;target&#39;,ifname);

	}


	</script>
Nach dem Login kopieren
php部分  error为0就代表文件上传成功 在之前写的h1标签里出现信息

<?php if(empty($_FILES)){
	exit(&#39;no file&#39;);
}

$error = $_FILES[&#39;pic&#39;][&#39;error&#39;] == 0 ? &#39;上传成功&#39;:&#39;上传失败&#39;;
echo "<script> parent.document.getElementsByTagName('h1')[0].innerHTML = '$error'";

?>
Nach dem Login kopieren

ajax--iframe模拟ajax文件上传效果

以上就介绍了ajax--iframe模拟ajax文件上传效果,包括了方面的内容,希望对PHP教程有兴趣的朋友有所帮助。

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage