подавить щелчок в представлении списка в виде прокрутки, если вы прокручивали - PullRequest
6 голосов
/ 15 июля 2011

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

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

<div id="vehicleScroller" data-scroll="y" style="height:444px">
    <p>
    <ul id="vehicleSearchResults" data-role="listview">
     <li>
        <a href="#PartyDetailsPage" data-id='${Number}' 
          onclick='return $.vehicle.PartyItemClick();'> 
          ${Name}&nbsp;
        </a>
      </li>
      [... more li's...]
    </ul>

  </div>

Я добавил некоторые диагностические журналы в jquery.mobile.scrollview и наблюдаю за происходящими событиями.Я надеялся, что смогу остановить щелчок во время прокрутки, но _handleDragStop всегда срабатывает перед PartyItemClick ().

Я также поиграл с включенным и выключенным изменением delayedClickEnabled, но, похоже, это не влияет на поведение при нажатии ссылки.

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

1) прежде чем я добавлю этот хакерский временной код, есть ли лучший способ отменить щелчок по этой ссылке?

2) если я хочу добавить свой собственный код обработчика событий в _handleDragStop, как мне это сделать.Я пробовал некоторые вызовы bind (), но я должен неправильно указывать имена событий.это то, что я пробовал:

$('#vehicleScroller').bind('_handleDragStop',function(){
    console.log('_handleDragStop-vehicleScroller');
});

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

// adding some custom code to the scrollview to track the 
$.mobile.scrollview.prototype._handleDragMove = (function() {
    var origDragMove = $.mobile.scrollview.prototype._handleDragMove;
    return function __handleDragMove() {
        $.util.SetLastMoveTime(); // this is the only new line of code
        origDragMove.apply(this, arguments);
    };
}());

затем, когда я обработал щелчоксобытие, я проверяю, прошло ли достаточно времени.

this.SearchResultItemClick = function(){

    if($.util.WasScrolling()) {
        event.stopPropagation();
        return false;
    }

это не самое лучшее решение, но, похоже, оно работает.Для полноты вот мои полезные функции:

LastMoveTime = 0;

this.SetLastMoveTime = function(){
    LastMoveTime = getCurrentTime();
}

function getCurrentTime() { return (new Date()).getTime(); }

this.WasScrolling = function(){
    var then = LastMoveTime;
    var now = getCurrentTime(); 
    var dif = now-then;
    //console.log("then:"+then+", now:"+now+", dif:"+dif);
    if(dif < 333){
        return true;
    }
    return false;
}

1 Ответ

1 голос
/ 06 декабря 2012

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

...