简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
Maison > interface Web > js tutoriel > le corps du texte

Javascript implémente l'événement glisser-déposer de fichiers

亚连
Libérer： 2018-05-28 13:43:37
original
1495 Les gens l'ont consulté

Cet article présente principalement en détail l'implémentation des événements glisser-déposer en javascript. Il a une certaine valeur de référence. Les amis intéressés peuvent s'y référer. Le code spécifique de l'événement glisser est pour votre référence. suit

1. Rendu :

2 Code source

Ce qui précède est ce que j'ai compilé pour tout le monde, j'espère. cela sera utile à tout le monde à l’avenir. 
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
  <style type="text/css">
    #p1 {
      width: 350px;
      height: 70px;
      padding: 10px;
      border: 1px solid #aaaaaa;
      text-align: center;
    }
  </style>
  <script type="text/javascript">
    function allowDrop(ev) {
      ev.preventDefault();
    }

    function drop(ev) {
      ev.preventDefault();
      console.log(ev.dataTransfer.files);
    }
  </script>
</head>
<body>

<p id="p1" ondrop="drop(event)" ondragover="allowDrop(event)">将文件拖放到此处</p>

</body>
</html>
Copier après la connexion

Articles connexes :

Méthode de l'environnement de développement Vue-cli pour implémenter des requêtes inter-domaines

Explication détaillée du webpack Vue-cli mobile Problème de construction automatisée du terminal

Nodejs natif utilise le partage de code Websocket

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：
javascript js 事件
source：php.cn
Article précédent：Comment utiliser Swiper dans Vue Article suivant：Comment configurer plusieurs pages en utilisant vue
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
Derniers articles par auteur
Derniers numéros
Diffusez des données depuis l'API d'OpenAI à l'aide d'AJAX, PHP et d'événements envoyés par le serveur. Comment puis-je utiliser les événements envoyés par le serveur (SSE) pour diffuser des don...
Depuis 2023-11-11 12:03:23
0
1
497
Uncaught TypeError : impossible de définir la propriété non définie (définir 'innerHTML') J'essaie de créer une page Web en utilisant php, sur un élément de classe "Continuous...
Depuis 2023-11-08 21:06:09
0
1
278
Comment obtenir la valeur RVB de la couleur nommée CSS/HTML en JavaScript J'ai créé un objet Javascript appelé [name-rgb]. Votre base : nomméeColors={AliceBlue:[240...
Depuis 2023-11-06 09:05:50
0
2
210
Pourquoi tant de scripts JavaScript ajoutent-ils des nombres aléatoires aux éléments ? collision? J'ai récemment appris JavaScript et j'ai vu de nombreux exemples d'utilisation de Math.ran...
Depuis 2023-11-04 20:00:04
0
2
296
Identifier les limitations de performances en JavaScript J'essaie de trouver le goulot d'étranglement dans mon Javascript. Fondamentalement, je dév...
Depuis 2023-10-31 20:47:17
0
1
229
Rubriques connexes
Plus>
Recommandations populaires
Tutoriels populaires
Plus>
Tutoriels associés
Recommandations populaires
Derniers cours
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois：Formation PHP en ligne sur le bien-être public，Aidez les apprenants PHP à grandir rapidement！