使用Mootools拖动时不会更新HTML

我正在使用Mootools（我认为这与问题无关）来拖放元素

var draggable = new Drag(timeHandle, {            
    onDrag: function () {           
        var calculatedTime = calcTime();     
        $('timeLabel').innerHTML = calculatedTime;
    },
});

基本上，我可以拖动我的“timeHandle”，并且“timeLabel”得到了正确的更新。 问题是，有时候，在稍微移动句柄之后，UI突然没有得到更新。“时间手柄”未移动，“时间标签”未竖起。 问题不在于拖动事件，我可以看到它不断被调用

当我搬家的时候

$('timeLabel').innerHTML = calculatedTime;

一切正常。 因此，问题不在于“Drag”对象，因为事件一直在调用。 看起来有一些UI性能问题

---

谢谢

好的，找到了一个解决方案。 我仍然不确定是什么导致了这个问题，但看起来“innerHTML”命令要么性能很差，导致GUI更新出现问题，要么可能是某种内部机制（仅限IE），它应该可以防止UI更新溢出

无论如何，我不使用innerHTML，而是执行以下操作：

var draggable = new Drag(timeHandle, {            
     onDrag: function () {             
         var calculatedTime = calcTime();     

         var element = $('timeLabel');
         element.removeChild(element.firstChild);l
         element.appendChild(element.ownerDocument.createTextNode(calculatedTime)); 
    },
});

---

像一个符咒一样工作

要简化代码，可以使用

元素.set（'text'，'my text here'）；

---

另外，请记住删除最后一个逗号，否则它将在Internet Explorer中抛出错误。

这是我的错，我删除了jQuery标记，不知道它是如何到达的：-（我正在使用Mootools。谢谢你更新这个提琴来重现你的问题？实际上它不会在这个提琴中重现。这意味着我的代码在其他地方可能有问题。奇怪。谢谢，我会做一些研究和更新。

var element=$（'timelabel'））

-因为这不会改变，所以请将引用保存在

onDrag

之外，以获得性能，dom中的查找非常昂贵，而且不会缓存。我不知道。谢谢

var element = $('timeLabel');
var draggable = new Drag(timeHandle, {            
    onDrag: function () {   
        element.set('text', calcTime());       
    }
});