comment envoyer l'événement au clone sans utiliser jquery sur iphone

Question

Voici le code:

$("#draggable").draggable({ 
    helper: 'clone' 
    }); 

utiliser ce code, si vous faites glisser la div, vous faites glisser le clone,

c'est mon code sans utiliser jquery et jquery-ui, je veux faire glisser le clone-un quand je fais glisser la div:

var $=function(str){ 
    var div=document.createElement('div') 
    div.innerHTML=str; 
    return div.firstChild; 
    } 
function id(id){ 
    return document.getElementById(id) 
    } 

et

id('draggable').addEventListener("touchstart", function(e) { 
    var clone_div=$('<div id="draggable_" style="z-index:11;color:red">'+ 
      '<p>Drag me to my target</p>'+ 
     '</div>') 
    clone_div.addEventListener("touchstart",function(e2){ 
     e2=e; 
    }) 
    }); 

et

id('draggable').addEventListener("touchmove", function(e) { 

       //if(e.changedTouches[0].target == id('draggable')){ 
        e.preventDefault(); 
        id('draggable').dragging=true; 
        //var orig = e.originalEvent; 
        var x = e.changedTouches[0].pageX; 
        var y = e.changedTouches[0].pageY; 

        id('draggable').style.left=x-70+'px'; 
        id('draggable').style.top=y-70+'px'; 

      }); 

Que puis-je faire?

grâce

Answer 1

il est ok maintenant:

id('draggable').addEventListener("touchstart", function (e) { 
      e.preventDefault(); 

      var clone_div = jmQuery('<div id="draggable_" style="z-index:111">' + 
           '<p>Drag me to my target</p>' + 
          '</div>'); 
      e.stopPropagation(); 
      function touchmove(e) { 
       var x = e.pageX; 
       var y = e.pageY; 
       clone_div.style.left = x - 70 + 'px'; 
       clone_div.style.top = y - 70 + 'px'; 
       id('demo').insertBefore(clone_div, id('demo').firstChild); 
       if (check_drop(e)) { 
        id('droppable').style.background = 'red'; 
       } else { 
        id('droppable').style.background = '#F6A828'; 
       } 
      } 

      function check_drop(e) { 
       var drop_bounds = id('droppable').getBoundingClientRect(); 
       var now_bounds = { 
        left: e.pageX-document.body.scrollLeft - 50, 
        top: e.pageY -document.body.scrollTop- 50, 
        right: e.pageX -document.body.scrollLeft+ 50, 
        bottom: e.pageY -document.body.scrollTop + 50 
       } 

       //判断是否在droppable内 
       if (!(now_bounds.right < drop_bounds.left || 
          now_bounds.left > drop_bounds.right || 
          now_bounds.bottom < drop_bounds.top || 
          now_bounds.top > drop_bounds.bottom) 
         ) { 
        return true; 
       } 
       return false; 
      } 
      function touchend(e) { 
       id('droppable').style.background = '#F6A828'; 
       if (check_drop(e)) { 
        id('droppable').appendChild(jmQuery(id('draggable_').innerHTML)); 
       }else{ 

       } 
       id('draggable_').parentNode.removeChild(id('draggable_')); 
       document.removeEventListener('touchmove', touchmove); 
       document.removeEventListener('touchend', touchend); 
      } 

      document.addEventListener("touchmove", touchmove); 
      document.addEventListener("touchend", touchend); 

     });