Возвращать false по ссылке, когда не связан с функцией в jquery - PullRequest
0 голосов
/ 04 марта 2012

У меня странная проблема, из-за которой я программирую анимацию карусельного типа в jQuery.У меня так, что при нажатии на ссылку он оживляет div.Чтобы предотвратить возможность щелчка по ссылкам во время анимации, я установил условие привязки, при котором ссылка привязывается к анимации, но во время анимации она не связана, а затем снова связывается в конце.Скрипка лучше всего демонстрирует: http://jsfiddle.net/aRrmD/1/.

Все это прекрасно работает в Fiddlr.Однако, когда я помещаю это в реальную веб-страницу, это не работает так хорошо, если вы дважды щелкаете ссылку - вы получаете первый щелчок, запускающий анимацию, а второй щелчок перезагружает страницу, потому что ссылка не привязана кфункция анимации во время анимации, поэтому поведение ссылки по умолчанию вступает в силу, и она становится стандартной ссылкой до тех пор, пока анимация не будет завершена и функция не будет привязана к ней.Поэтому, если вы дважды щелкнете по ссылке, она перезагрузит страницу при втором клике.Я не знаю, почему он не делает этого в Fiddlr, это должно быть связано с тем, как события работают с этой системой, что отличает ее от отдельной страницы.

Так что я хочу бытьможно сделать так, чтобы, когда ссылка не была привязана (т.е. во время анимации), предотвращала поведение ссылки по умолчанию.Я знаю, что мог бы обойти это, сделав якорь не якорем, но это часть более широкой системы, которая, к сожалению, не дает мне никакого контроля над этим.

Спасибо за любые указатели люди ...

1 Ответ

0 голосов
/ 04 марта 2012

Вы можете проверить, выполняется ли анимация, вместо того, чтобы откреплять и привязывать обработчик события:

function moveNext(e) {
    e.preventDefault();
    var $carousel = $('.carousel');
    if(!$carousel.is(':animated')) {
        $carousel.animate({
            marginLeft: '-=' + widthOfItem
        }, 500)
    }
}

Ссылка: :animated


Если вы действительно хотите отсоединить и связать обработчик событий, добавьте другой обработчик событий, который всегда предотвращает действие по умолчанию:

$('.btn-next').bind('click', false); // will always prevent the default action
$('.btn-next').bind('click', moveNext);

Передача false в .bindтак же, как прохождение function() { return false;).Это предотвращает всплывающее по умолчанию действие и , поэтому оно может быть именно тем, что вам нужно.Но вместо этого вы можете просто передать function(e) { e.preventDefault(); }.

Тогда вместо отмены привязки всех обработчиков событий вы можете отменить привязку moveNext:

$('.btn-next').unbind(moveNext);

Вы должны кешироватьссылка на $('.btn-next') хотя или используйте $(this).

...