页面跳转事件不加载?

dengxue 发布于 2014/05/04 13:49
阅读 834
收藏 0

我在header里写了两个navbar的导航,我想实现在页面一开始只显示第一个navbar,隐藏第二个,使用javascript写的。但点击链接页面跳转后该功能就失效了,javascript里的内容没有读,不过刷新页面后又好了,求大神们帮忙,怎么能在页面跳转后不手动刷新的情况下实现这功能。代码如下:

<script type="text/javascript">
	$(document).on("pageinit",function(){
		$("#nav2").hide();
		$("#nav1").on("swipe",function(){
			$("#nav1").hide();
			$("#nav2").show();
		})
		$("#nav2").on("swipe",function(){
			$("#nav2").hide();
			$("#nav1").show();
		})
	})
	</script>

<div data-role="page"  data-theme="c">	  
<div data-role="header">
	<div data-role="navbar" id="nav1" >
	  	<ul>
	  		<li><a href="index.jsp">首页</a></li>
	  		<li><a href="index2.jsp">新闻</a></li>
	  		<li><a href="#">图片</a></li>
	  	</ul>
	</div>
	<div data-role="navbar" id="nav2">
	  	<ul>
	  		<li><a href="#">首页</a></li>
	  		<li><a href="#">首页</a></li>
	  		<li><a href="#">首页</a></li>
	  	</ul>
	</div>
</div>	  	
</div>



加载中
0
Narky
Narky


$('#pageid').on('pageshow', function(){
    // code here...
});

代码要写在data-role="page"的容器里面,不然不能加载


0
dicvh0xq
dicvh0xq

描述的还是不太清楚 ?

你的跳转是多页模板内跳转 还是到一个新的页面了?

JQuery Mobile 默认是AJAX跳转的 会缓存起来 所以 js就没有加载 你刷新了就加载了 可以添加属性取消ajax连接 如rel="external" 或者其它

0
lock_free
lock_free

$( document ).ready( handler ).

返回顶部
顶部