Jquery Mobile $（document）.ready（）;

Question

我正在尝试制作移动网页。该页面有一个图像滑块。但我对document.ready()

有疑问

我搜索过这个问题，每个人都告诉我使用：

$(document).bind('pageinit', function() {});

但我认为滑块想要

$document.ready ( or I can't run) 

Slider名称为bxslider（bxslider.com）

我认为有不同的解决方案：

1. 禁用jquery mobile的ajax加载，每个页面都会重新加载，文档准备就绪。

2. 更改图片滑块。

有人有建议吗？

编辑：我忘了添加代码抱歉http://d.pr/n/SNW7

Answer 1

使用pageshow pagehide

等事件

$( 'div' ).on( 'pageshow',function(event, ui){
  alert( 'This page was just hidden: '+ ui.prevPage);
});

$( 'div' ).on( 'pagehide',function(event, ui){
  alert( 'This page was just shown: '+ ui.nextPage);
});

http://jquerymobile.com/demos/1.2.1/docs/api/events.html

或类似

$(document).on('pagebeforeshow', '#index', function(){ 
    $('.bxslider').bxSlider({
        slideWidth: 360
    });    
});

Answer 2

我遇到了与JQM + bxSlider相同的问题，经过调查和测试后，我找到了JQM的解决方案。

你必须使用$ document.ready和$（document）.on（＆＃39; pageshow＆＃39;

看看这个例子。在这个例子中，你有一个名为bxslider的滑块，ID为＃34;测验＆＃34;：

<script>
    $(document).ready(function() {
        myCarousel=$('.bxslider').bxSlider({
            captions: false,
            infiniteLoop: false,
            hideControlOnEnd: true,
            slideMargin: 10,
            adaptiveHeight : true
        });   
    });

    $(document).on('pageshow', '#Quiz', function(){ 
        myCarousel.reloadSlider();
    });
</script>

希望这有帮助。