Mootools: Как запретить `var drag` в зависимости от установленного флажка? - PullRequest
Новая
       16

Mootools: Как запретить `var drag` в зависимости от установленного флажка?

0 голосов
/ 10 июля 2010

Mootools : как разрешать и запрещать var drag в зависимости от checkbox проверено или нет? 

window.addEvent('domready',function() {
  var z = 2;
  $$('#dragable').each(function(e) {
    var drag = new Drag.Move(e,{
      grid: false,
      preventDefault: true,
      onStart: function() {
        e.setStyle('z-index',z++);
      }
    });
  });
});
function check(tag){
  if(tag.checked){
    //checkbox checked
    //How to Disallow Drag.Move for #dragable ?
    //Unfortunately so it does not work - drag.destroy(); drag.removeEvents();
  }else{
    //How to Allow Drag.Move for #dragable ?
  }
}
<input type="checkbox" onClick="check(this);">
<div id="dragable">Drag-able DIV</div>

Спасибо!

1 Ответ

1 голос
/ 11 июля 2010

Сохраните экземпляр Drag в MooTools Хранилище элементов , поэтому, когда флажок установлен, мы можем извлечь этот экземпляр и управлять им.

Drag.Move является расширением базового класса Drag , и если вы увидите документы, вы заметите, что в этой ситуации есть два метода:

Эти методы необходимо вызывать для объекта перетаскивания, который создается при вызове new Drag.Move(..), чтобы включить или отключить перетаскивание.

Итак, сначала создайте объект перетаскивания, как вы уже делаете: 

var drag = new Drag.Move(e, {
    ...
});

, а затем сохраните ссылку на этот drag объект в хранилище элементов для последующего поиска. 

e.store('Drag', drag);

Здесь вы можете использовать любую нужную клавишу - я использовал "Drag".

Затем, позже, в функции проверки, извлеките объект перетаскивания и вызовите attach или detach для него в зависимости отсостояние флажка. 

function check(elem) {
    var drag = elem.retrieve('Drag'); // retrieve the instance we stored before

    if(elem.checked) {
        drag.detach(); // disable dragging
    }
    else {
        drag.attach(); // enable dragging
    }
}

См. ваш пример , измененный для работы с этимфлажок.

Если вы извлекаете элемент по идентификатору, вам не нужно использовать $$, так как в идеале должен быть только элемент с этим идентификатором.$$("#dragable") слишком избыточный и менее производительный.Вместо этого используйте document.id('dragable') или $("dragable").

...