Смахнуть переход

У меня проблема с jQueryMobile, я ищу ответ много часов и ничего не работает:(

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

Код выше работает нормально, но через некоторое время он становится безумным.

Я нахожусь в "Раздел A", я провожу пальцем вправо, и я "Раздел B", я провожу пальцем влево, я возвращаюсь к "A", затем я снова проведу вправо и я иду к "C" и один раз на "C", если я проведу снова карусель, которая соединяет

Я перехожу со страницы C на A, затем я возвращаюсь к B, возвращает C и т. Д.... и после десятилетия изменений он останавливается на странице, и, проведя пальцем по экрану, это больше эффект сумасшедшей прокрутки

следующий и предыдущий URL

в HTML

   <div data-role="page" data-dom-cache="false" class="actus-page" id="news" data-theme="a" data-next="http://wip17.kenjidev.com/n/39409" data-prev="http://wip17.kenjidev.com/n/39423" data-title="La vitalité de la traduction, levier décisif de la diversité éditoriale">

если я добавлю строку loadpage, у этого заряда будет бесконечное количество страниц ajax (там более 50 000 элементов..)

и JS

  $( document ).on( "pageinit", "[data-role='page'].actus-page", function() {
    var page = "#" + $( this ).attr( "id" ),
        next = $( this ).jqmData( "next" ),
        prev = $( this ).jqmData( "prev" );

    if ( next ) {
        //$.mobile.loadPage( next + ".htm" );
        $( document ).on( "swipeleft", page, function() {
            console.log(next +' : ' + page + ' : ' + prev );
            $.mobile.changePage( next  , {transition: "slide"});
        });
    }
    if ( prev ) {
        $( document ).on( "swiperight", page, function() {
            console.log(prev +' : ' + page + ' : ' + next );
            $.mobile.changePage( prev, { transition: "slide" , reverse: true } );
        });
    }
});

Спасибо за помощь


Редактировать: решено

Спасибо Омар за вашу помощь

В конечном итоге здесь код решает все проблемы:

 $( document ).on( "pageinit", ".actus-page", function() {
var 
    $page = $(this),
    page = "#" + $page.attr( "id" ), 
    next = $page.jqmData( "next" ), 
    prev = $page.jqmData( "prev" ); 

if ( next ) {  
    $page.on( "swipeleft", function() { 
        $.mobile.changePage( next , {transition: "slide"}); 
    }); 
} 

if ( prev ) { 
    $page.on( "swiperight", function() { 
        $.mobile.changePage( prev, { transition: "slide" , reverse: true} ); 
    }); 
}});

1 ответ

Решение

Если каждая страница имеет идентификатор, используйте приведенный ниже код для динамического перемещения между страницами в DOM.

$(document).on('swipeleft swiperight', function (event) {
 if(event.type == 'swiperight') {
  var prevpage = '#' + $.mobile.activePage.prev('div[data-role="page"]')[0].id;
  $.mobile.changePage(prevpage, {
   transition: 'slide',
   reverse: true
  });
 }

 if(event.type == 'swipeleft') {
  var nextpage = '#' + $.mobile.activePage.next('div[data-role="page"]')[0].id;
  $.mobile.changePage(nextpage, {
   transition: 'slide',
   reverse: false
  });
 }
});
Другие вопросы по тегам