我不明白为什么我的加载页面不是第一个被点击的页面,有人可以向我解释它不是吗? (我一直在看这几个小时,我觉得是时候再买一双眼睛了)
出于某种原因,它总是直接进入thread_page并且错过了loading_page。
<div id="loading_page" data-role="page" data-theme="a" data-url="loading_page" class="landing_background">
<!-- <div class="landing_overlay"></div> -->
<div class="landing_main_logo">
<img src="logo-with-tag-line.png" />
<div class="loading-cube">
<div class="load-cube1 load-cube"></div>
<div class="load-cube2 load-cube"></div>
<div class="load-cube4 load-cube"></div>
<div class="load-cube3 load-cube"></div>
</div>
</div>
</div>
<div id="thread_page" data-role="page" data-url="thread_page" data-theme="a">
<div data-role="footer">
<div data-role="navbar" class="nav-glyphish-example ui-navbar" data-grid="d" role="navigation">
<ul class="ui-grid-d">
<li class="ui-block-a">
<a href="#" id="chat" data-icon="camera" data-theme="a" class="ui-btn ui-btn-icon-top ui-btn-up-a">
<span class="ui-btn-inner">
<span class="ui-btn-text">Chat</span>
</span>
</a>
</li>
<li class="ui-block-b">
<a href="#" id="email" data-icon="camera" data-theme="a" class="ui-btn ui-btn-up-a ui-btn-icon-top">
<span class="ui-btn-inner">
<span class="ui-btn-text">Email</span>
</span>
</a>
</li>
<li class="ui-block-c">
<a href="#" id="skull" data-icon="camera" data-theme="a" class="ui-btn ui-btn-up-a ui-btn-icon-top">
<span class="ui-btn-inner">
<span class="ui-btn-text">Danger</span>
</span>
</a>
</li>
<li class="ui-block-d">
<a href="#" id="beer" data-icon="camera" data-theme="a" class="ui-btn ui-btn-up-a ui-btn-icon-top">
<span class="ui-btn-inner">
<span class="ui-btn-text">Beer</span>
</span></a>
</li>
<li class="ui-block-e">
<a href="#" id="coffee" data-icon="camera" data-theme="a" class="ui-btn ui-btn-up-a ui-btn-icon-top">
<span class="ui-btn-inner">
<span class="ui-btn-text">Coffee</span>
</span>
</a>
</li>
</ul>
</div>
</div>
</div>
<script>
$("#loading_page").bind("pageinit", function(event){
alert("WOOPS");
});
</script>
答案 0 :(得分:1)
你确定它不起作用吗?我看到了console.log
请注意,pageinit
为deprecated since 1.4.0
此事件已在1.4.0中弃用,转而使用pagecreate。只是 在上面的例子中替换pageinit。
$("#loading_page").bind("pageinit", function(event){
console.log("WOOPS");
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
<div id="loading_page" data-role="page" data-theme="a" data-url="loading_page" class="landing_background">
<!-- <div class="landing_overlay"></div> -->
<div class="landing_main_logo">
<img src="logo-with-tag-line.png" />
<div class="loading-cube">
<div class="load-cube1 load-cube"></div>
<div class="load-cube2 load-cube"></div>
<div class="load-cube4 load-cube"></div>
<div class="load-cube3 load-cube"></div>
</div>
</div>
</div>
<div id="thread_page" data-role="page" data-url="thread_page" data-theme="a">
<div data-role="footer">
<div data-role="navbar" class="nav-glyphish-example ui-navbar" data-grid="d" role="navigation">
<ul class="ui-grid-d">
<li class="ui-block-a">
<a href="#" id="chat" data-icon="camera" data-theme="a" class="ui-btn ui-btn-icon-top ui-btn-up-a">
<span class="ui-btn-inner">
<span class="ui-btn-text">Chat</span>
</span>
</a>
</li>
<li class="ui-block-b">
<a href="#" id="email" data-icon="camera" data-theme="a" class="ui-btn ui-btn-up-a ui-btn-icon-top">
<span class="ui-btn-inner">
<span class="ui-btn-text">Email</span>
</span>
</a>
</li>
<li class="ui-block-c">
<a href="#" id="skull" data-icon="camera" data-theme="a" class="ui-btn ui-btn-up-a ui-btn-icon-top">
<span class="ui-btn-inner">
<span class="ui-btn-text">Danger</span>
</span>
</a>
</li>
<li class="ui-block-d">
<a href="#" id="beer" data-icon="camera" data-theme="a" class="ui-btn ui-btn-up-a ui-btn-icon-top">
<span class="ui-btn-inner">
<span class="ui-btn-text">Beer</span>
</span></a>
</li>
<li class="ui-block-e">
<a href="#" id="coffee" data-icon="camera" data-theme="a" class="ui-btn ui-btn-up-a ui-btn-icon-top">
<span class="ui-btn-inner">
<span class="ui-btn-text">Coffee</span>
</span>
</a>
</li>
</ul>
</div>
</div>
</div>