Mootools:拖放问题
时间:2020-03-05 18:39:23 来源:igfitidea点击:
我已经在Mootools网站上的论坛上问了这个问题,一个人说我的班级选择被破坏了,之后管理员来了并将我的职位状态改为无效。不用说,这并没有太大帮助。然后,我没有回应就发布到了mootools的Google组。我的问题是,为什么我的.drop元素不会触发" enter"," leave"," drop"事件? .drag元素的事件正在运行。
<title>Untitled Page</title> <script type="text/javascript" src="/SDI/includes/mootools-1.2.js"></script> <script type="text/javascript" src="/SDI/includes/mootools-1.2-more.js"></script> <script type="text/javascript" charset="utf-8"> window.addEvent('domready', function() { var fx = []; $$('#draggables div').each(function(drag){ new Drag.Move(drag, { droppables: $$('#droppables div'), onDrop: function(element, droppable){ if(!droppable) { } else { element.setStyle('background-color', '#1d1d20'); } element.dispose(); }, onEnter: function(element, droppable){ element.setStyle('background-color', '#ffffff'); }, onLeave: function(element, droppable){ element.setStyle('background-color', '#000000'); } }); }); $$('#droppables div').each(function(drop, index){ drop.addEvents({ 'enter': function(el, obj){ drop.setStyle('background-color', '#78ba91'); }, 'leave': function(el, obj){ drop.setStyle('background-color', '#1d1d20'); }, 'drop': function(el, obj){ el.remove(); } }); }); }); </script> <form id="form1" runat="server"> <div> <div id="draggables"> <div class="drag"></div> <div class="drag"></div> <div class="drag"></div> <div class="drag"></div> <div class="drag"></div> <div class="drag"></div> <div class="drag"></div> <div class="drag"></div> <div class="drag"></div> <div class="drag"></div> </div> <div id="droppables"> <div class="drop"></div> <div class="drop"></div> <div class="drop"></div> <div class="drop"></div> <div class="drop"></div> <div class="drop"></div> </div> </div> </form>
解决方案
回答
好的,这里似乎有几个问题。据我所知,mootools中没有"可丢弃的"东西。这意味着"输入","离开"和"放下"之类的事件将不起作用。 (这些是拖动对象上的事件)
如果将这些名称更改为mootools元素具有的事件(例如DOM事件),则代码将完美运行。例如,如果将" enter"和" leave"更改为" mouseover"和" mouseout",则事件触发不会有问题。 (在Windows Vista上为Opera 9.51)
这似乎是文档中有关该事件使用DOM事件的启示行。
http://docs.mootools.net/Element/Element.Event#Element:addEvents
此外,在该页面上,还有常规元素可以具有的事件的链接。
http://www.w3schools.com/html/html_eventattributes.asp
但是,在nabble论坛上给" TG in SD"建议可能是最好的。如果可以的话,请不要理会这些事件。将我们需要做的所有事情都放在可拖动对象中,并为自己省去所有的麻烦。