Jquery Mobile页面显示功能

Question

我正在使用jqm框架构建一个webapp,并且pageshow在包含jQuery小部件k3dcarousel时我一直在尝试使用该函数.在有问题的页面上,我在data-role="page"div 下面有我的脚本,

$("#page-about").live(
    "pageshow",
    function (event) {
        $('#k3dCarousel_portrait').k3dCarousel();
    }
);

似乎我需要点击我的链接两次才能加载JS函数,这会让我觉得我使用这个函数是错误的.此外,如果我不使用该 $("#page-about").die(); 函数下面的pageshow函数,如果我单击返回然后再次单击该链接,脚本将被多次加载.

我使用pageshow逻辑错了吗？有没有更好的方法来实现我想要做的事情:将AJAX这个页面放到我的移动框架中.

我理解这是一个相当具体的问题,但希望对此有一个通用的答案,因为在我看来,这可能发生在任何小部件上.

非常感谢任何帮助,如果有帮助,我可以粘贴更多代码.

感谢您的时间.

Answer 1

由于您绑定到pageshow事件,因此每次查看页面时都会触发匿名函数.如果您只想在页面的第一个视图上调用代码,则可以绑定到pagecreate/pageinit事件或检查pageshow代码中是否存在k3dCarousel :

$("#page-about").live(
    "pageshow",
    function (event) {
        //check for the existence of HTML within the container element
        if ($('#k3dCarousel_portrait').html().length == 0) {
            $('#k3dCarousel_portrait').k3dCarousel();
        }
    }
);

以下是所有jQuery Mobile特定事件的解释:http://jquerymobile.com/demos/1.0rc3/docs/api/events.html