2016-02-01 1 views
11

У меня было много:перезапись событие кран с preventDefault

$('#element').on('tap', function(){ 
    // some code .. 
}) 

Я искал много вопросов о проблеме tap событий стрельбы в два раза, и я решил свою проблему с помощью e.preventDefault(), теперь у меня есть много:

$('#element').on('tap', function(e){ 
    e.preventDefault(); 
    // some code .. 
}) 

Хорошо, но как я уже сказал, у меня есть многие из этих вызовов, и я не люблю много писать каждый раз e.preventDefault(), то я напечатал $.fn.tap на консоли ап Хрома d он показал мне:

function (a){return a?this.bind(c,a):this.trigger(c)} 

Я попытался переписать это так:

$.fn.tap = function (a) { 
    a.preventDefault(); 
    return a?this.bind(c,a):this.trigger(c) 
} 

Но она не работала, как это было в предыдущем e.preventDefault().

Я не вижу ничего очевидного, и у меня нет идей для этого.

Любая помощь или идея оцениваются. Заранее спасибо.

+1

$ $ .fn.tap' создает функцию, называемую '$ ('# element'). Tap()', она не создает событие – adeneo

+1

function (e) { e.preventDefault(); e.stopPropagation(); } –

+0

попробуйте вернуть false. если вы стреляете по функции в jqyer –

ответ

3

Одна из интересных особенностей jQuery (обычно я не использую jQuery 'и' cool 'в одном предложении) заключается в том, что он позволяет вам указать настраиваемое поведение для событий, используя объект $.event.special.

На эту тему есть very little documentation, поэтому может быть приведен пример. рабочая скрипку, используя click событие (, как это было более удобно для меня, чтобы написать на моем ноутбуке) can be found here

Переведенный на запрос, чтобы всеtap события e.preventDefault() вызывается до фактического обработчика, будет выглядеть как:

$.event.special.tap.add = function(options) { 
    var handler = options.handler; 

    options.handler = function(e) { 
    e.preventDefault(); 

    return handler.apply(this, arguments); 
    } 
} 

что делает этот код (должно делать, так как я на самом деле не протестировал tap версий выше) говорят JQuery, что вы хотите специальную обработку для tab события, в частности, вы хотите предоставить «обработчик обертывания», который делает не что иное, как вызов e.preventDefault() перед вызовом предоставленного обработчика событий.

UPDATE: предотвращено по умолчанию tap -Settings от перезаписи, для будущих посетителей


ПРИМЕЧАНИЕ: Перед тем, как делать какие-либо попытки по изменению поведения по умолчанию вещей, вы должны спросить себя, почему значения по умолчанию не работают для вас. В основном потому, что изменение поведения по умолчанию (= ожидаемое) нарушит ваше будущее (или, что еще хуже, другое лицо), при сохранении кода и добавлении функций.

Для создания поддерживаемого (и прогнозируемого) потока в коде предлагаемое решение для создания специальной функции ($.fn.tap) на самом деле является очень жизнеспособным решением, так как оно не мешает стандартным (= ожидаемым) поведение вещей.

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

+0

Человек, это потрясающе !! .. Я просто изменил ваш код на '$ .event.special.tap.add = function() { ... 'потому что' Object {tapholdThreshold: 750, emitTapOnTaphold: true} 'были заменены, а событие' tap' потерпело неудачу, но теперь оно отлично работает! –

+0

Благодарим вас за знакомство с 'специальным'. заслуженная награда +1 – BenG

+0

Спасибо! Я обновил образец кода, чтобы отразить ваше предложение @WashingtonGuedes, которое фактически предотвращает перезапись других значений. –

0

У меня была аналогичная проблема, в которой e.preventDefault() работал бы в некоторых случаях, но не на других. Он не обнаружил ошибок, и использование try-catch не отображало catch alert. Добавление e.stopImmediatePropagation() сделал трюк, в случае, если это поможет кому

10

Это, как вы можете создать свой $.fn.tap: -

$.fn.tap = function(f) { 
    $(this).on('tap', function(e) { 
    e.preventDefault(); 
    f(); 
    }); 
    return this; 
}; 

//usage 
$('.selector').tap(function() { 
    alert('foo bar') 
}) 

@Washington Гуэдес - перезаписать тук-события по умолчанию, чтобы всегда использовать е .preventDefault() вместо изменения от $ (элемента) .А ('водопроводной', функция() {}) для $ (элемент) .TAP (функция() {})

Вы можете добавить событие делегата в body для tap без указания цели. Затем он запустит все события tap на теле, которые вы можете проверить, имеет ли цель целевое событие tap, поэтому вы можете затем e.preventDefault();.

ПРИМЕЧАНИЕ: Это не будет работать для делегированных tap событий, как показано.

// global tap handler 
 
$('body').on('tap', function(e) { 
 
    if ($._data(e.target, "events").tap) 
 
    e.preventDefault(); 
 
}); 
 

 
// tap event 
 
$('a.tap').on('tap', function(e) { 
 
    $(this).css('color', 'red'); 
 
}); 
 

 
// delegated tap event 
 
$('body').on('tap', 'a.delegate', function(e) { 
 
    $(this).css('color', 'green'); 
 
});
a { 
 
    display: block; 
 
    margin: 20px 0; 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.js"></script> 
 

 
<a class="tap" href="www.google.co.uk">tap event, prevented.</a> 
 
<a class="delegate" href="www.google.co.uk">delegate tap event, not prevented.</a> 
 
<a href="www.google.co.uk">no tap event, not prevented</a>

1

Я знал, что может быть плохой идеей, но я только что проверил это в Chrome

$('*').on('tap',function(e){ 
    e.preventDefault(); 
}); 

$('#element').on('tap', function(){ 
    // some code .. 
}); 

и если вам не нужно это для всех элементов:

$('*').not('#aCertainElement').on('tap',function(e){ 
    e.preventDefault(); 
}); 
Смежные вопросы