eme*_*his 5 jquery jquery-mobile
我正在尝试编写一个包含多个内部页面的简单应用程序.从#page2我想返回#page1AND重新加载它,以便javascript生成的内容将刷新.
<body>
<div id="page1" data-role="page">
<script type="text/javascript">
//Javascript spits out something new every time
</script>
</div>
<div id="page2" data-role="page">
<a id="page1button" href="page1" data-role="button">go to page1</a>
</div>
</body>
我可以使这项工作的唯一方法是通过增加rel="external"对#page1button.内容刷新,但有一个突然的页面重新加载不性感.有没有办法实现相同的结果,但仍然使用jqm的过渡？
我知道这是一个很受欢迎的问题,我已经做了很多研究,包括关于更改页面的jqm文档,但我尝试过的任何内容似乎都没有用.$.mobile.changePage()似乎有一个选择:reloadPage:true声称完全符合我的需要,但它不起作用.我甚至试过$.mobile.loadPage()之前.changePage(),仍然没有运气.救命!
我很确定这不是一个缓存问题,因为这是我的页面元素的样子,并且每当我返回页面时它仍然显示相同的*$#%&ing事物:
<div id="page2" data-role="page" data-cache="never" data-dom-cache="false"> ...
我认为javascript块只在html页面加载时被调用一次,而不是每次我使用jqm返回到div.也许解决这个问题的方法是找出一种方法来强制该代码块再次运行.有任何想法吗？
好消息:我找到了解决这个问题的页面:http://jquerymobile.com/test/docs/pages/page-scripting.html
坏消息:它声称会起作用......
$( document ).delegate("#page1", "pageinit", function() {
alert('RE-RUN JAVASCRIPT');
});
......不!我把这个函数放在我的html文件的头部,它只运行一次.
仍然在努力解决这个问题.我在这里放了一些代码:http://dl.dropbox.com/u/28286159/index.html
为了简单起见,我只做了两页,其中一页包含<script>打印出来的内容:document.write(Math.random());
你会看到这个数字不会改变.
这是一个解决方案。你的 #predict 页面仍然在 dom 中，因为它是一页。所以是的，你的 math.random 代码只执行一次。只需将随机数绑定到“告诉我”按钮的点击，并使用点击生成的新随机数更新#prediction。
<script>
$(function(){
$('#tellme').click(function(){
randomNumber = Math.random();
$('#prediction').html(randomNumber);
$.mobile.changePage('#predict', {transition:'pop'});
});
});
</script>
<section id="home" data-role="page">
<div data-role="header">
<h1 class="">HOME</h1>
</div><!-- /header -->
<div data-role="content">
<div id="iknow">Here's a random number...</div>
<a href="#" data-role="button" id="tellme">TELL ME!</a>
</div><!-- /content -->
</section><!--#home-->
<section id="predict" data-role="page">
<div data-role="header">
<h1 class="">PREDICT</h1>
</div><!-- /header -->
<div data-role="content">
<div id="prediction"></div>
<a id="tryagain" href="#home" data-role="button" data-transition="pop">Try again.</a>
</div><!-- #content -->
</section><!-- #predict -->
| 归档时间： |
|
| 查看次数： |
6491 次 |
| 最近记录： |