需要在jQuery中綁定pageInserted函數的幫助

我需要一些幫助來理解如何獲取我在我的index.html文件中工作的腳本，以便在使用ajax加載的子頁面中工作。需要在jQuery中綁定pageInserted函數的幫助

在我的索引文件中，我有一個可以在該頁面工作的腳本，很好。現在我希望它能與我用-ajax-jquery加載的seperat html頁面一起工作。

我想，我需要使用類似.bind（「pageInserted」 ......但我不知道怎麼辦。

腳本讓您滾動兩個div的兩個向上/向下滑動可以。回/堡

，我在我的索引文件（並在那裏工作）的腳本是：

var page_flip, vertical_scroll,myScroll, 
    disable_h = disable_v = false, 
    prev_page = prev_x = prev_y = 0, 
    pages; 

function loaded() { 
    setTimeout(function() { 
     pages = document.querySelectorAll('.scroller'); 

     page_flip = new iScroll('pageflip', { 
      hScrollbar: false, 
      vScrollbar: false, 
      snap:true, 
      momentum:false, 
      onScrollEnd: updateVerticalScroller 
     }); 

     vertical_scroll = new iScroll(pages[page_flip.pageX], { 
      hScrollbar: false, 
      vScrollbar: false 
     }); 



     // Free some mem 
     window.removeEventListener('load', loaded, false); 
    }, 100); 
} 

function updateVerticalScroller() { 
    prev_x = vertical_scroll.x; 
    prev_y = vertical_scroll.y; 

    if (page_flip.pageX!=prev_page) { 
     if (page_flip.pageX == 0) 
      highlightStartPageButton(); 
     else if (page_flip.pageX == 1) 
      highlightMenuButton(); 

     vertical_scroll = vertical_scroll.destroy(); 
     pages[prev_page].style.webkitTransitionDuration = '0'; 
     pages[prev_page].style.webkitTransform = 'translate3d(' + prev_x + 'px, ' + prev_y + 'px, 0)'; 
     vertical_scroll = new iScroll(pages[page_flip.pageX], { 
      hScrollbar: false, 
      vScrollbar: false 
     }); 
     prev_page = page_flip.pageX; 
    } 
}

，並在索引文件的div是：

<div id="pagewrapper"> 
    <div id="pageflip"> 


<div class="scrollerwrapper"> 
<div class="scroller"> 

content in div1 (page1) goes here......... 

</div> 
</div> 

<div class="scrollerwrapper"> 
<div class="scroller"> 

content in div2 (page2) goes here......... 

</div> 
</div> 


</div> 
</div>

，我想這個腳本工作的子頁面demo.html看起來像在上方爲iscroll腳本索引文件+兩個div的div工作：

<div id="wrapper22" class="scrollerwrapper">--need this for the iscroll to work 
<div id="mag1" class="scroller2">--need this for the iscroll to work 


<div id="pagewrapper"> 
<div id="pageflip"> 


<div class="scrollerwrapper"> 
<div class="scroller"> 

content in div1 goes here......... 

</div> 
</div> 


<div class="scrollerwrapper"> 
<div class="scroller"> 

content in div2 goes here......... 

</div> 
</div> 

</div> 
</div> 


</div> 
</div>

我真的有些並欣賞幫助瞭解如何解決這個問題並使其運作。非常感謝！

來源

2011-01-28 Claes Gustavsson

您是否使用jQuery的通過AJAX加載頁面？ Here's 的文檔。它可以讓你設置當內容已經被加載回調：

$('#result').load('ajax/test.html', function() { 
    alert('Load was performed.'); 
});

來源

2011-01-28 06:54:26 roflwaffle

嗨roflwaffle 我想我:-)，使用im jqtouch和jQuery加載頁面（其移動應用）。我使用這個腳本使iscroll在子頁面上工作：

var myScroll; 
$(document.body).ready(function(){ 
    $('#hem').load('home/home1.asp'); 
    loaded(); 
    $(this).bind('pageInserted', function(event, info) { 

     var $inserted = info.page; 
     var $scroll = $inserted.find('.scroller2'); 

     var elm = $inserted.find(".scrollerwrapper");//document.getElementById('wrapper2'); 
     if (elm != null) 
      elm.css("height", window.innerHeight);//elm.style.height = window.innerHeight + "px"; 

     myScroll= new iScroll($scroll.attr("id"), {desktopCompatibility:true,hScrollbar: false,vScrollbar: false}); 

    }); 
});

來源

2011-01-28 08:04:24

需要在jQuery中綁定pageInserted函數的幫助

回答

相關問題