Maison > développement back-end > tutoriel php > PHP utilise iframe pour télécharger et afficher des images

PHP utilise iframe pour télécharger et afficher des images

*文
Libérer: 2023-03-18 22:40:01
original
2192 Les gens l'ont consulté

J'ai travaillé sur une fonction de téléchargement d'images ces jours-ci. Je voulais à l'origine utiliser ajax pour télécharger des images afin d'obtenir un rafraîchissement instantané, mais cela n'a jamais été possible. Plus tard, j'ai utilisé le framework iframe pour y parvenir. Permettez-moi de le partager avec vous maintenant et de le donner comme référence pour tout le monde. J'espère que cela aide tout le monde.

Cependant, il y a un problème lors de l'utilisation de ce framework. Après avoir téléchargé l'image, je dois renvoyer le chemin téléchargé vers ce cadre. Comment le supprimer ? Dans un premier temps, j'affiche la valeur directement dans le cadre. iframe, mais lorsque je suis allé suivre le chemin, il n'y a eu aucune réponse. J'ai continué à vérifier les informations en ligne, mais les différentes versions ne fournissaient pas d'explication complète sur la façon d'utiliser iframe pour télécharger des images, puis réaliser l'actualisation en temps réel. fonction, j’ai donc dû l’étudier moi-même. La plupart d'entre eux disent que comment télécharger est suffisant. Je sais comment faire cela. C'est vraiment inconfortable de s'arrêter ici, je ne peux l'étudier que moi-même

Puisque la valeur est affichée sur la page une fois le téléchargement réussi. l'iframe, ce n'est pas possible. Je l'ai retiré, j'ai essayé N méthodes et vérifié N quantités d'informations. C'était vraiment pénible.

Plus tard, ajoutez un src dans l'iframe, puis écrivez la valeur de sortie dans une simple instruction javascript à afficher une fois l'image téléchargée avec succès, hehe. Pour résumer :

code html :

<iframe id="upload_target" name="upload_target" src="upload.php" style="width:0;heigth:0;overflow:hidden;border:0;position: absolute; left:-500px;"></iframe> //iframe设置成隐藏的,src链接的页面为图片上传的后台文件页面,不过加不加影响都不大,只不过为了更精确而已
<img id="tag_img" src="" />
<form enctype="multipart/form-data" action="upload.php" method="post" target="upload_target">
   <input type="file" name="userfile" class="file" value="" />
   <input type="submit" name="uploadimg" value="上传" />
</form> //表单的那么值对应着空框架的那么值,提交后跳转到空框架中,这样就不对父窗口页面进行刷新了
Copier après la connexion

après soumission à la page upload.php en arrière-plan pour vérification. Il y aura un chemin auto-défini généré

Ensuite, après avoir mis à jour avec succès l'image, nous pouvons supprimer ce chemin, modifier le chemin de l'image dans la zone d'image de la fenêtre parent via JS et le réaffecter, ce qui équivaut à actualiser Au lieu d'avoir à accéder à la base de données pour récupérer l'adresse du chemin enregistré et la mettre à jour à chaque fois que la mise à jour réussit.

Ici, j'écris uniquement le code js à renvoyer

echo "<script type=&#39;text/javascript&#39;>window.parent.document.getElementByIdx_x(&#39;tag_img&#39;).setAttribute(&#39;src&#39;,&#39;$updurl&#39;);</script>";
    //这就是在框架中输出一段js代码,然后操作父框架中图片地址刷新成我上传的图片地址,$updurl为上传图片的地址
Copier après la connexion

De cette façon, je peux facilement télécharger des images sans actualiser la page, et les images peuvent être actualisées à temps.

Recommandations associées :

Code d'implémentation du téléchargement de fichier image PHP

Comment implémenter les vignettes d'images PHP

Principe d'analyse et code du téléchargement de fichiers image PHP

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
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
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal