Question

在html5中编写拖放程序。当从src拖动元素并将其拖放到目标时，会将新元素的副本添加到目标作为子元素。这个新添加的ele被赋予可移动性，我需要为它添加拖动事件。我写了一个功能，它将ele id和操作类型作为参数。添加新元素（删除到目标）时将调用此函数。这对我来说似乎没有用。

动态添加src元素的函数：

function dragsrc(ele, op) {
     var dragstartfunc = ele.id + "dragStart";
     var dragendfunc = ele.id + "dragEnd";
     LOG(dragstartfunc);
     LOG(dragendfunc);
     ele.addEventListener('dragstart', dragstartfunc, false);
     ele.addEventListener('dragend', dragendfunc, false);
     window[dragstartfunc] = function(event) {
         LOG(dragstartfunc);
         event.dataTransfer.setData('text/html', ele.type);
         event.dataTransfer.effectAllowed = op;
     };
     window[dragendfunc] = function(event) {
         LOG(dragendfunc);
     };
 }

动态添加目标元素的功能：

function dragtarget(ele, op) {
     var dragenterfunc = ele.id + "dragEnter";
     var dragoverfunc = ele.id + "dragOver";
     var dragleavefunc = ele.id + "dragLeave";
     var dropfunc = ele.id + "drop";
     LOG(dragenterfunc);
     LOG(dragoverfunc);
     LOG(dragleavefunc);
     LOG(dropfunc);
     ele.addEventListener('dragenter', dragenterfunc, false);
     ele.addEventListener('dragover', dragoverfunc, false);
     ele.addEventListener('dragleave', dragleavefunc, false);
     ele.addEventListener('drop', dropfunc, false);
     /* Drop target event handlers */
     window[dragenterfunc] = function(event) {
         event.preventDefault();
     };
     window[dragoverfunc] = function(event) {
         event.dataTransfer.dropEffect = op;
         LOG(" :" + event.clientX + " and :" + (240 - event.clientX));
         LOG(":" + event.clientY + " andy :" + (100 - event.clientY));
         event.preventDefault();
         return true;
     };
     window[dragleavefunc] = function(event) {};
     window[dropfunc] = function(event) {
         LOG(" :" + event.clientX + " and :" + (240 - event.clientX));
         LOG(":" + event.clientY + " andy :" + (100 - event.clientY));
         var data = event.dataTransfer.getData('text/html');
         var ele = createinputele(data);
         var eletext = createinputele("text");
         var img = createimg("./labeledit.gif", "edit");
         event.target.appendChild(eletext);
         event.target.appendChild(img);
         event.target.appendChild(ele);
         return true;
     };
 }

如果我手动调用这些函数（传递虚拟事件参数），它不会抛出任何未定义的函数。错误，这意味着定义了fucntions但它没有被事件监听器选中。因为每当拖动任何src时，它的dragstart fucntion都没有被调用（我没有看到日志注释LOG被定义）。我想要实现可能的目标吗？

用于在JS中编写事件处理函数的函数

0 个答案: