【发布时间】：2013-07-30 18:06:22
【问题描述】：
我对 jquery 还很陌生，我想使用面板功能，但是我的代码并没有真正工作。我从http://jquerymobile.com/demos/1.3.0-beta.1/docs/panels/ 复制了大部分内容，只是为了测试，面板占据了整个屏幕，关闭按钮不起作用，我不知道我做错了什么。这是我的代码：
<body>
<div id="content">
<div data-role="page">
<div data-theme="a" data-role="header" data-position="fixed">
<h3>
Test
</h3>
<a href="#menu-panel"class="ui-btn-left" data-icon="bars">Menu</a>
</div>
</div>
<div data-role="panel" data-position="left" data-theme="a" data-position-fixed="true" data-display="push" id="menu-panel">
<ul data-role="listview" data-theme="a" class="nav-search">
<li data-icon="delete"><a href="#" data-rel="close">Close menu</a></li>
<li><a href="#panel-fixed-page2">Accordion</a></li>
<li><a href="#panel-fixed-page2">AJAX Navigation</a></li>
<li><a href="#panel-fixed-page2">Autocomplete</a></li>
<li><a href="#panel-fixed-page2">Buttons</a></li>
<li><a href="#panel-fixed-page2">Checkboxes</a></li>
<li><a href="#panel-fixed-page2">Collapsibles</a></li>
<li><a href="#panel-fixed-page2">Controlgroup</a></li>
<li><a href="#panel-fixed-page2">Dialogs</a></li>
<li><a href="#panel-fixed-page2">Fixed toolbars</a></li>
<li><a href="#panel-fixed-page2">Flip switch toggle</a></li>
<li><a href="#panel-fixed-page2">Footer toolbar</a></li>
<li><a href="#panel-fixed-page2">Form elements</a></li>
<li><a href="#panel-fixed-page2">Grids</a></li>
<li><a href="#panel-fixed-page2">Header toolbar</a></li>
<li><a href="#panel-fixed-page2">Icons</a></li>
<li><a href="#panel-fixed-page2">Links</a></li>
<li><a href="#panel-fixed-page2">Listviews</a></li>
<li><a href="#panel-fixed-page2">Loader overlay</a></li>
<li><a href="#panel-fixed-page2">Navbar</a></li>
<li><a href="#panel-fixed-page2">Navbar, persistent</a></li>
<li><a href="#panel-fixed-page2">Pages</a></li>
<li><a href="#panel-fixed-page2">New</a></li>
<li><a href="#panel-fixed-page2">Popup</a></li>
<li><a href="#panel-fixed-page2">Radio buttons</a></li>
<li><a href="#panel-fixed-page2">Select</a></li>
<li><a href="#panel-fixed-page2">Slider, single</a></li>
<li><a href="#panel-fixed-page2">New</a></li>
<li><a href="#panel-fixed-page2">New</a></li>
<li><a href="#panel-fixed-page2">New</a></li>
<li><a href="#panel-fixed-page2">Text inputs & textarea</a></li>
<li><a href="#panel-fixed-page2">Transitions</a></li>
</ul>
</div><!-- /panel -->
</div>
</body>
头部带有脚本 .js 和 .css 调用：
<script src="https://d10ajoocuyu32n.cloudfront.net/jquery-1.9.1.min.js"></script>
<script src="https://d10ajoocuyu32n.cloudfront.net/mobile/1.3.1/jquery.mobile-1.3.1.min.js"></script>
<link rel="stylesheet" href="https://d10ajoocuyu32n.cloudfront.net/mobile/1.3.1/jquery.mobile-1.3.1.min.css"/>
<link rel="stylesheet" media="all and (orientation:portrait)" href="portrait.css"/>
<link rel="stylesheet" media="all and (orientation:landscape)" href="landscape.css"/>
任何帮助将不胜感激！
【问题讨论】：
-
当您尝试询问有关 jQuery Mobile 的问题时，请考虑使用 jquery-mobile 标签添加它：)
-
我完全忽略了这一点。感谢您的编辑！
-
没问题 :) 很高兴为您提供帮助:)
标签： jquery html jquery-mobile panel