我使用jQuery Mobile创建了一个示例Web应用程序。
我创建了两个<div>
s;一个包含 href ,另一个包含内容。当我点击HREF它显示jquery-mobile脚本错误如下所示:
加载页面时出错
有人可以看到可能导致此错误的原因吗?
<html> <head runat="server"> <title>How to expand collapse div layer using jQuery</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.5.min.js"></script> <script type="text/javascript" src="http://code.jquery.com/mobile/1.0a3/jquery.mobile-.0a3.min.js"></script> <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a3/jquery.mobile-.0a3.min.css" />
<script language="javascript">
$(document).ready(function () {
var $pages = $('#pages > *').hide();
$('#content a').click(function() {
$pages.hide();
$($(this).attr('href') ).show();
});
});
</script>
</head>
<body>
<div data-role="page">
<div data-role="header" class='header_align'>Bristol-Myers Squibb</div>
<h2>
How to expand collapse div layer using jQuery</h2>
<div id="toggle">
<div id="heading">Heading</div>
<div id="content">
<ul>
<li><a href="#page-1">Page1</a></li>
<li><a href="#page-2">Page2</a></li>
<li><a href="#page-3">Page3</a></li>
</ul>
</div>
</div>
<div id="pages">
<div id="page-1">Page 1 Content</div>
<div id="page-2">Page 2 Content</div>
<div id="page-3">Page 3 Content</div>
</div>
</div>
</body>
</html>
答案 0 :(得分:1)
具有命名锚点的链接的jQuery移动默认行为是跳转到具有相应id的页面(data-role =“page”)。但是第1页,第2页或第3页没有这样的页面,因此发生错误。
试试这个
$(document).ready(function () {
var $pages = $('#pages > *').hide();
$('#content a').click(function() {
$pages.hide();
$($(this).attr('href') ).show();
return false;
});
});