موتولس:مشكلة السحب والإفلات

Question

لقد طرحت هذا السؤال على المنتديات الموجودة على موقع Mootools وقال أحد الأشخاص إن اختيار الفصل الخاص بي كان تالفًا قبل أن يأتي المسؤول ويغير حالة مشاركتي إلى غير صالحة.وغني عن القول أن هذا لم يساعد كثيرا.قمت بعد ذلك بالنشر في مجموعة Google لـ mootools دون أي رد.سؤالي هو لماذا لا يتم تنشيط الأحداث "إدخال" و"مغادرة" و"إسقاط" لعناصر ".drop" الخاصة بي؟الأحداث الخاصة بعناصر السحب تعمل.

<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>

Answer 1

حسنًا، يبدو أن هناك مشكلتين هنا.بقدر ما أستطيع أن أقول، لا يوجد شيء اسمه "قابل للإسقاط" في mootools.وهذا يعني أن أحداثك مثل "الدخول" و"المغادرة" و"الإفلات" لن تعمل.(هذه أحداث على كائن السحب)

إذا قمت بتغيير هذه الأسماء إلى الأحداث التي تحتوي عليها العناصر في mootools (كما هو الحال في أحداث DOM)، فإن التعليمات البرمجية الخاصة بك تعمل بشكل مثالي.على سبيل المثال، إذا قمت بتغيير "إدخال" و"مغادرة" إلى "تمرير الماوس" و"إخراج الماوس"، فسيتم تشغيل الأحداث دون أي مشكلة.(أوبرا 9.51 على نظام التشغيل Windows Vista)

يبدو أن هذا هو السطر الموضح في الوثائق الخاصة بهذا، والذي يوضح الإحصائيات لاستخدام أحداث DOM.

http://docs.mootools.net/Element/Element.Event#Element:addEvents

يوجد أيضًا في تلك الصفحة رابط للأحداث التي يمكن أن تحدثها العناصر العادية

http://www.w3schools.com/html/html_eventattributes.asp

لكن، النصيحة "TG in SD" التي قدمتها لك في منتديات nabble ربما هو الأفضل.إذا كنت تستطيع، فلا تهتم باستخدام هذه الأحداث.ضع كل ما تريد القيام به في الكائن القابل للسحب، ووفر على نفسك كل هذه المتاعب.

Answer 2

وفق مستندات Mootools, "droppables" هو أحد الخيارات المتوقعة من قبل Drag.Move فصل.في الواقع، هذه هي مجموعة العناصر التي تتفاعل مع العنصر عندما يطلق "drop," "enter،" و "leave" حدث.