将JS加载到JQM页面

Question

我试图得到一个插件运行在JQM上，但我需要它等待和加载时，第二页是活动的。现在，它在启动时加载。我用data-role='page'设置了我的页面。下面是我的代码：

$(document).ready(function(){
    $("#two").bind('pageinit')
    jQuery(".namesleft").fitText();
    jQuery(".scoreleft").fitText();
    jQuery(".namesright").fitText();
    jQuery(".scoreright").fitText();
});

提前感谢你的帮助

Answer 1

下面是一个有效的jsFiddle示例：http://jsfiddle.net/Gajotres/F2Gcm/

$(document).on('pageshow', '#index', function(){       
    $("h1").fitText(0.273);
    $(".download").fitText(1);
});

应使用方法上的而不是live方法来绑定页面事件，live方法已弃用，在jQuery 1.9+中不存在。

此外，这应该被绑定到页面显示事件，因为它在任何其他情况下都不起作用。jQuery移动版严格要求插件进行可视化更改，这种插件只能在页面显示事件中工作。

如果您想更好地了解jQuery移动页面事件，请查看此，或找到它的。

Answer 2

除了$(document).ready之外，jQuery手机还有另一个选择。代码应该如下所示：

    <script type="text/javascript">
       $('div:jqmData(role="page")').live('pagebeforeshow',function(){
             // code to execute on each page change
       });
</script>

事实上，除了常规的jQuery事件之外，jQm还提供了一整套事件替代方案：http://jquerymobile.com/demos/1.2.1/docs/api/events.html

Answer 3

您可以将代码添加到JQM的页面展示事件中，如下所示：

$("#two").live('pageshow', function(){
    $(".namesleft, .scoreleft, .namesright, .scoreright").fitText();
});