Блог

Главная - Вопросы по программированию - перетащите динамический элемент в js с возможностью перетаскивания

перетащите динамический элемент в js с возможностью перетаскивания

#javascript #html #jquery #draggable

Вопрос:

У меня небольшая проблема, я хочу перетаскивать изображения, созданные динамически в JS, но я могу перетащить их только со второй попытки, с первой попытки мне показывают запрещающий знак. Сложность в том, что элемент, который я хочу перетащить, создается динамически

 <!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <!-- https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP -->
    <meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self'">



    <script src="jquery.js"></script>
    <link rel="stylesheet" href="jquery-ui-1.12.1.custom/jquery-ui.min.css">
    <script src="jquery-ui-1.12.1.custom/external/jquery/jquery.js"></script>
    <script src="jquery-ui-1.12.1.custom/jquery-ui.min.js"></script>
    <link rel="stylesheet" href="index.css">

    <script defer src="render.js"></script>
    <title>AppLienPerso</title>
  </head>
  <body>

    <button id="createPerso" class="btn btn-primary">Créer Personnage</button>


    
    <script src="./renderer.js"></script>
  </body>
</html>


 
 const CreerPerso = document.getElementById('createPerso');

  CreerPerso.onclick = CreationPersonnage;

  const body = document.querySelector('body');

  function CreationPersonnage() {
      const divImg = document.createElement('div');
      divImg.classList.add("imgPerso");

      divImg.innerHTML = "<img src='images/circle.png' />";
      body.appendChild(divImg);
    }



$(document).on('dragstart','.imgPerso',function(){

    $ (".imgPerso").draggable();

})
Метки: