jQuery mobile $(document).ready等效

Fab*_* B. 24 ajax document-ready jquery-mobile

在ajax导航页面中,用于执行初始化javascript的经典"文档就绪"表单根本不会触发.

在ajax加载的页面中执行某些代码的正确方法是什么?

(我的意思是,不是我的ajax ......它是jquery移动页面导航系统,它带我到那个页面)

好吧,我确实怀疑过这样的事情......非常感谢=)但是......它仍然不起作用,这是我的代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Run Code Online (Sandbox Code Playgroud)

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>mypage</title>

    <link rel="stylesheet" href="jquery.mobile-1.0a4.min.css" />
    <script type="text/javascript" src="jquery-1.5.min.js"></script>
    <script type="text/javascript" src="jquery.mobile-1.0a4.min.js"></script>
    <script type="text/javascript">
        $('div').live('pageshow',function(event, ui){
          alert('ciao');
        });
    </script>

</head>

<body>

    <div data-role="page">

        <div data-role="header" data-position="fixed">
            <h1>Shopping Cart</h1>
        </div>

        <div data-role="content"> asd


        </div>

    </div>

</body>
Run Code Online (Sandbox Code Playgroud)

我需要指定div id吗?

Jur*_*nov 19

我花了一些时间研究相同的问题,因为JQM文档目前还不是很详细.以下解决方案对我来说很好:

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

您必须实现自己的检查流程,以防止多次初始化,因为上面的代码将在每次页面更改时运行

  • 我认为这已经过时了. (5认同)
  • 您想绑定到"pageinit"事件.来自JQM文档:http://jquerymobile.com/test/docs/api/events.html (2认同)

Cra*_*lot 14

绑定到"pageinit"事件.来自JQM docs:http://api.jquerymobile.com/pageinit/


Ran*_*952 12

最好的等效$(document).ready()IS$(document).bind('pageinit')

只需查看jQuery Mobile文档:http://jquerymobile.com/demos/1.1.1/docs/api/events.html

重要提示:使用$(document).bind('pageinit'),而不是$(document).ready()

你在jQuery中学到的第一件事就是在$(document).ready()函数中调用代码,这样一旦加载了DOM就会执行所有操作.但是,在jQuery Mobile中,Ajax用于在导航时将每个页面的内容加载到DOM中,而DOM ready处理程序仅针对第一个页面执行.要在加载和创建新页面时执行代码,您可以绑定到pageinit事件.此事件在本页底部详细说明.


nau*_*tur 5

如果您希望代码在某个页面上运行(我敢打赌就是这种情况),您可以使用以下模式:

$('div:jqmData(url="thepageyouwanted.html")').live('pageshow',function(){
    // code to execute on that page
    //$(this) works as expected - refers the page
});
Run Code Online (Sandbox Code Playgroud)

您可以使用的活动:

  • pagebeforeshow 在转型之前开始
  • pageshow 过渡后立即开始
  • pagecreate 仅在第一次加载页面时启动