recherche

Maison >interface Web >js tutoriel >Téléchargement de fichiers et affichage des fichiers téléchargés

Téléchargement de fichiers et affichage des fichiers téléchargés

黄舟
黄舟original
2017-02-18 13:17:291425parcourir

1. Contexte du problème

Utilisez le fichier du composant de téléchargement de fichier pour télécharger le fichier et afficher le fichier (image)


2. Code source d'implémentation

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>文件上传并展示文件路径</title>
		<script type="text/javascript" src="../js/jquery-1.12.3.js" ></script>
		<script>
			$(document).ready(function(){
				$("#fileUpload").off().on("change",function(){
					var fileUpload = $(this).val();
					var proUrl = window.location.protocol;
					var pageUrl = window.location.host;
					var path = proUrl + "//" +pageUrl + "/AngularJS/pages/";
					$("#uploadImg").attr("src",path+fileUpload);
					console.info(path+fileUpload);
				});
			});
		</script>
	</head>
	<body>
		<p>
			<input type="file" id="fileUpload" name="upload" /><br><br>
			<img  id="uploadImg"   style="max-width:90%" alt="Téléchargement de fichiers et affichage des fichiers téléchargés" >
		</p>
	</body>
</html>


3. Résultats de la mise en œuvre

Téléchargement de fichiers et affichage des fichiers téléchargés

Ce qui précède est le contenu du téléchargement de fichiers et l'affichage des fichiers téléchargés pour. Pour plus de contenu connexe, veuillez faire attention au site Web PHP chinois (www.php.cn) !


Déclaration：
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Article précédent：Directive AngularJS ng-ifArticle suivant：Directive AngularJS ng-if

Articles Liés

Voir plus