JQuery предотвращает запуск события click при прокрутке div

Звучит достаточно легко? Но я использую настраиваемый элемент управления прокруткой (http://github.com/inuyaksa/jquery.nicescroll), и я пробовал большинство трюков, которые я видел, чтобы предотвратить это, когда используя draggable(). Но они не работают для этого... Я загрузил страницу и код здесь:

Демо: http://www.beforethecode.net/blazin Источник: http://www.beforethecode.net/blazin/blazin.zip

Это для проекта с сенсорным экраном. Пока единственным решением было привязать $thumbs к "dblclick", чтобы остановить стрельбу после перетаскивания мыши/пальца... Но мне бы очень хотелось заставить его работать с одним щелчком мыши после того, как прокрутка остановилась.

Ответы

Ответ 1

Ваш лучший выбор будет решением, аналогичным тому, сколько автозаполнений будет работать, отменяя собственные события и вместо этого используя тайм-ауты и флаги действовать только при желаемых обстоятельствах:

  • event.preventDefault() "click" событие на связанных элементах управления, теги <a /> и т.д. (т.е. не допускается поведение какого-либо родного браузера, связанное с нажатием кнопки запуска).
  • В событии "click" после предотвращения по умолчанию установите действие click в маленьком setTimeout и сохраните дескриптор тайм-аута.
  • В событии "stopdrag" очистите дескриптор тайм-аута; это будет теоретически происходить во время периода ожидания события "click" и предотвратить щелчок после логического stopdrag, тогда как при реальном нажатии не будет stopdrag для отмены таймаута (так что действие будет выполняться по желанию).

код:

var clickActionTimeout = null;

function clearClickActionTimeout() {
  if(clickActionTimeout) {
    clearTimeout(clickActionTimeout);
    clickActionTimeout = null;
  }
}

$elem.click(function(e) {
  e.preventDefault();
  clearClickActionTimeout();
  clickActionTimeout = setTimeout(function() {
    // This was a real click if we got here...
    openPicture();
  }, 200);
});

$elem.bind('stopdrag', function() {
  clearClickActionTimeout();
});

Ответ 2

Я не работаю с этой библиотекой, но, возможно, это поможет вам. Как получить, это не для мобильного устройства, это для сенсорного экрана. Все работает нормально на моем телефоне, прокрутка в порядке.

У вас есть некоторые свойства конфигурации, и некоторые из них выглядят просто для ваших нужд. Вот некоторые из них:

. touchbehavior - включить прокрутку курсора, как сенсорные устройства на настольном компьютере, по умолчанию - false

. cursordragontouch, перетащить курсор в режим touch/touchbehavior (по умолчанию: false)

https://github.com/inuyaksa/jquery.nicescroll/blob/master/README

Я не вижу ваш код, ваша ссылка сломана, возможно, вы уже знаете об этих свойствах. Но если нет, надеюсь, это поможет вам. Это просто найти кобыловое гнездо.

Ответ 3

Я не знаю, как управлять событиями касания. Однако так я бы сделал это для событий click, и я думаю, что он не сильно отличается от тех http://jsfiddle.net/USvay/

Идея состоит в том, чтобы предотвратить событие щелчка, и вместо этого ваша функция желания будет срабатывать в режиме мыши, если определенное время прошло или не прошло.

var clicked = true,
    tOut;

$('a').on('click', function (e) {
    e.preventDefault();
}).on('mousedown', function () {


    tOut = setTimeout(function () {
        clicked = false;
    }, 200);



}).on('mouseup', function () {

    if (clicked == true) {
        clearTimeout(tOut);
        my_function();

    } else {
        clicked = true;
        $('<p>Dragged</p>').appendTo('#result');
    }

});

function my_function() {
    $('<p>Clicked</p>').appendTo('#result');
}