1

我正在设置滑动导航以与 jquery mobile 一起使用。我创建了一个基于导航 ul 设置下一个和后退 url 的函数(使用变量传递到函数中)。

该函数在初始加载和使用 window.location 而不是正确的 $.mobile.changePage ajax 调用时效果很好。有没有办法在每次 ajax 页面加载后重置此函数的变量,以便它具有正确的路径。

我在每个页面的 data-role="page" 元素中调用它,但变量仍在加载时传递。

function swipeNav(targetList){
        /* Setup Nav array - links and IDs */
        var navIDs = new Array();
        var navLinks = new Array();
        var nextPage = 0;
        var pervPage = 0;

        /* Setup Nav array with links and ids */
        $(targetList + ' li').each(function(){
          navIDs.push($(this).find('a').attr('id'));
          navLinks.push($(this).find('a').attr('href'));
        });

        /* Get current nav item based on location path */
        var currentURL = window.location.pathname;
        var htmlPage = currentURL.split('/');

        var currentPage = $.inArray(htmlPage[htmlPage.length-1], navLinks);
        if(currentURL == "/"){
            currentPage = 0;
            }

        /* Get number of nav items, prepare for navigation loop */
        var navLoop = navLinks.length;

        /* Sets next & prev page number based on current URL path */
        nextPage = currentPage + 1;
        prevPage = currentPage - 1;

        /* Add swipe support for navigation / based on navigation items */
        $('body').live('swipeleft swiperight',function(event){
            if (event.type == "swipeleft") {
                if(nextPage == navLoop){ $.mobile.changePage(navLinks[0]); }
                else{ $.mobile.changePage(navLinks[nextPage]); }    /* If last page of nav, loop to page 1 */
             }
             if (event.type == "swiperight") {
                if(prevPage < 0){ $.mobile.changePage(navLinks[navLoop - 1]); }
                else{ $.mobile.changePage(navLinks[prevPage]); } /* If first page of nav, loop to last page */
             }
        });
    }

这是每个页面中对该函数的调用

<div id="page-load" data-role="page" data-theme="a">
<script type='text/javascript' src='js/swipenav.js'></script>
<script>
$(document).ready(function() {
swipeNav('ul.nav-links');      
});
</script>
4

0 回答 0