需要在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函数的帮助

回答

相关问题