Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Блокирование .click() (https://javascript.ru/forum/jquery/37109-blokirovanie-click.html)

shmonoff 08.04.2013 10:33

Блокирование .click()
 
Подскажите пожалуйста, сам разобраться не могу:
есть контейнер, содержащий 9 других контейнеров, каждый из которых содержит еще по 2:
<div class="common">
        <div id="1">
            <div class="front"></div>
            <div class="back"></div>
        </div>
        ...
        <div id="9">
            <div class="front"></div>
            <div class="back"></div>
        </div>
</div>

и соответствующий обработчик анимации
$(document).ready(function () {
    $('.common div').click(function() {
        $(this).find('div').rotate3Di('flip',500,{sideChange:mySideChange})
    })
})

Суть проблемы в том, чтобы отключать обработчик на время выполнения анимации, то есть до окончания ее выполнения надо блокировать обработку события .click(). Ковырял в сторону setTimeout() и флагов, но результата так и не добился - обработчик нового события упорно срабатывает до окончания предыдущей анимации. Уповаю на ваш опыт, друзья.

tsigel 08.04.2013 10:36

Самый простой и грубый способ - на время анимации заслонить экран прозрачным дивом, клик по которому ничего не делает.

tsigel 08.04.2013 10:45

Или с флагом:
var flag = new Boolean(true);
$(document).ready(function () {
    $('.common div').click(function() {
        if (flag) {
           flag = false;
           $(this).find('div').rotate3Di('flip',500,{sideChange:mySideChange},  function () {
             flag = true;
           });
        }
    })
})

devote 08.04.2013 10:50

$(document).ready(function () {
    var fn, div = $('.common div');
    div.bind('click', fn = function() {
        div.unbind('click', fn); // снимаем обработчик
        $(this).find('div').rotate3Di('flip',500,{sideChange:mySideChange}, function() {
            div.bind('click', fn); // вешаем его обратно
        });
    })
})

danik.js 08.04.2013 11:48

Тут бы что-то вроде
addEventListener('click', function(e) { e.cancelBubble = true }, true);
помогло если б не IE...
Или pointerEvents:none.
Хотя проще и эффективнее - способ, описанный tsigel..

shmonoff 08.04.2013 15:46

Всем спасибо, ничего не получается :(
даже такой интересный код подсказали, и то не работает:
$('.common div').click(function() {
    var self = $(this)
      , func = arguments.callee
    ;
    self.unbind('click', func)
        .find('div')
        .rotate3Di('flip', 500, {
            sideChange: mySideChange
            complete: function () {
                self.click(func);
            }
        })
    ;
});

tsigel 08.04.2013 15:50

Если ничего не получается - значит что-то не правильно делаете. Мой первый предложный метод не может не работать (правда он груб, зато эффективен).

shmonoff 13.04.2013 03:19

в общем на время анимации закрываю экран прозрачным дивом, все остальные способы не работают почему-то


Часовой пояс GMT +3, время: 08:32.